btn@import url('flatpickr.min.css');

* {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
	outline: none;
	font-size-adjust: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-font-smoothing: antialiased!important;
    -webkit-transform: translate3d(1,1,1);
    transform:translate3d(1,1,1);    
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

*:focus {
	outline: none;
}

*,*:after,*:before {	
    -webkit-box-sizing: border-box;	
    -moz-box-sizing: border-box;	
    box-sizing: border-box;	
    padding: 0;	
    margin: 0;
}
.checkbox-error input[type="checkbox"]:checked + label::before {
    background-color: #FF0606;
    border-color: #FF0606;
}
.checkbox-error input[type="checkbox"]:checked + label::after {
    color: #ffffff;
}

.checkbox-dynreal input[type="checkbox"]:checked + label::before {
    background-color: #2850D0;
    border-color: #2850D0;
}
.checkbox-dynreal input[type="checkbox"]:checked + label::after {
    color: #ffffff;
}

.noflex{
    display: block;
}
.flex-grow-1 {
    flex-grow: 1;
}
.flex{
    display: flex;
}

.dataTables_scrollBody::-webkit-scrollbar {
    width: 1px;
}

/* Track */
.dataTables_scrollBody::-webkit-scrollbar-track {
    background: transparent;
}

/* Handle */
.dataTables_scrollBody::-webkit-scrollbar-thumb {
    background: #888;
}

/* Handle on hover */
.datatable-container::-webkit-scrollbar-thumb:hover {
    background: #555;
}

#countrows{
    float: left;
    font-size: 1.4rem;
    color: #25628f;
}
/*.preloader {
 /* border: 16px solid #f3f3f3; /* Light grey */
  /*border-top: 16px solid #3498db; /* Blue */
 /* border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
  position: fixed;
  top: 45%;
  left: 47%;
  z-index: 9999999;
}*/
.z-index-1000{
	z-index: 1000;
}
.preloader {
  width: 50px;
  height: 50px;
  position: fixed;
  top: 39%;
  left: 49%;
  z-index: 9999999;
  background: #fff;
}

.lds-ripple {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
    position: absolute;
    top: calc(50% - 3.5px);
    left: 0;
    right: 0;
    margin: 0 auto!important;
}
#cdReport .lds-ripple {
    top: calc(50% + 250px);
}
#Trunk .lds-ripple {
    top: calc(50% + 250px);
	left: 49%!important;
}
.read-date{
    display: grid;
    cursor: pointer;
}
#allmessage-datatable tbody tr:hover {
    background-color: #f5f5f5; 
}
#punchclock-datatable tbody tr:hover {
    background-color: #f5f5f5; 
}
#time{
	line-height: 0.8;
	font-weight: 700;
}
#date{
	line-height: 0.8;	
	font-weight: 700;
}
.clock{
	text-align: right;
	padding-right: 20px;
	color: white;
}
.cards{
	margin-bottom: 0;
	height: 8.8rem;
}
#add_notification .modal-content .modal-header{
    cursor: move;
}
#get_Client_Licenses td{
    text-align: center;
    vertical-align: middle;
    height: 100%;
}
#get_Client_Licenses .pricecost_icon .mdi.mdi-coin {
    left: 16px;
    top: 25px;
}
img, svg {
    vertical-align: middle;
}
svg.tea #teabag {
    transform-origin: top center;
    transform: rotate(3deg);
    animation: swing 2s infinite;
}
svg.tea #steamL {
    stroke-dasharray: 13;
    stroke-dashoffset: 13;
    animation: steamLarge 2s infinite;
}
svg.tea #steamR {
    stroke-dasharray: 9;
    stroke-dashoffset: 9;
    animation: steamSmall 2s infinite;
}
li.bell{
    margin-left: 0!important;
}
@-moz-keyframes steamLarge{0%{stroke-dashoffset:13;opacity:.6}100%{stroke-dashoffset:39;opacity:0}}@-webkit-keyframes steamLarge{0%{stroke-dashoffset:13;opacity:.6}100%{stroke-dashoffset:39;opacity:0}}@-o-keyframes steamLarge{0%{stroke-dashoffset:13;opacity:.6}100%{stroke-dashoffset:39;opacity:0}}@keyframes steamLarge{0%{stroke-dashoffset:13;opacity:.6}100%{stroke-dashoffset:39;opacity:0}}@-moz-keyframes steamSmall{10%{stroke-dashoffset:9;opacity:.6}80%{stroke-dashoffset:27;opacity:0}100%{stroke-dashoffset:27;opacity:0}}@-webkit-keyframes steamSmall{10%{stroke-dashoffset:9;opacity:.6}80%{stroke-dashoffset:27;opacity:0}100%{stroke-dashoffset:27;opacity:0}}@-o-keyframes steamSmall{10%{stroke-dashoffset:9;opacity:.6}80%{stroke-dashoffset:27;opacity:0}100%{stroke-dashoffset:27;opacity:0}}@keyframes steamSmall{10%{stroke-dashoffset:9;opacity:.6}80%{stroke-dashoffset:27;opacity:0}100%{stroke-dashoffset:27;opacity:0}}
#cover {position: fixed; height: 100%; width: 100%; top:0; left: 0; background: #fff; z-index:9999;}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
select {
    -webkit-appearance: menulist;
    box-sizing: border-box;
    align-items: center;
    white-space: pre;
    -webkit-rtl-ordering: logical;
    color: black;
    background-color: white;
    cursor: default;
    border-width: 1px;
    border-style: solid;
    border-color: initial;
    border-image: initial;
}

.chart-legend li span{
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 5px;
}

.chart-legend{
  height:250px;
  overflow:auto;
}
.search.form-group .input-group .glyphicon {
	position: absolute;
}
.punchclock .table-responsive{
	min-height: auto!important;
	padding-bottom: 20px!important;
	padding-top: 0!important;
}
/** Custom Select **/
.custom-select-wrapper {
  position: relative;
  display: inline-block;
  user-select: none;
}
  .custom-select-wrapper select {
    display: none;
  }
  .custom-select {
    position: relative;
    display: inline-block;
  }
    .custom-select-trigger {
      position: relative;
      display: block;
      width: 130px;
      padding: 0 84px 0 22px;
      font-size: 22px;
      font-weight: 300;
      color: #fff;
      line-height: 60px;
      background: #5c9cd8;
      border-radius: 4px;
      cursor: pointer;
    }
      .custom-select-trigger:after {
        position: absolute;
        display: block;
        content: '';
        width: 10px; height: 10px;
        top: 50%; right: 25px;
        margin-top: -3px;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        transform: rotate(45deg) translateY(-50%);
        transition: all .4s ease-in-out;
        transform-origin: 50% 0;
      }
      .custom-select.opened .custom-select-trigger:after {
        margin-top: 3px;
        transform: rotate(-135deg) translateY(-50%);
      }
  .custom-options {
    position: absolute;
    display: block;
    top: 100%; left: 0; right: 0;
    min-width: 100%;
    margin: 15px 0;
    border: 1px solid #b5b5b5;
    border-radius: 4px;
    box-sizing: border-box;
    box-shadow: 0 2px 1px rgba(0,0,0,.07);
    background: #fff;
    transition: all .4s ease-in-out;
    
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-15px);
  }
  .custom-select.opened .custom-options {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
    transform: translateY(0);
  }
    .custom-options:before {
      position: absolute;
      display: block;
      content: '';
      bottom: 100%; right: 25px;
      width: 7px; height: 7px;
      margin-bottom: -4px;
      border-top: 1px solid #b5b5b5;
      border-left: 1px solid #b5b5b5;
      background: #fff;
      transform: rotate(45deg);
      transition: all .4s ease-in-out;
    }
    .option-hover:before {
      background: #f9f9f9;
    }
    .custom-option {
      position: relative;
      display: block;
      padding: 0 22px;
      border-bottom: 1px solid #b5b5b5;
      font-size: 18px;
      font-weight: 600;
      color: #b5b5b5;
      line-height: 47px;
      cursor: pointer;
      transition: all .4s ease-in-out;
    }
    .custom-option:first-of-type {
      border-radius: 4px 4px 0 0;
    }
    .custom-option:last-of-type {
      border-bottom: 0;
      border-radius: 0 0 4px 4px;
    }
    .custom-option:hover,
    .custom-option.selection {
      background: #f9f9f9;
    }

td {
    word-wrap: break-word;
 }
.white{
	color:white;
}
.font-size-14{
    font-size: 14px!important;
    padding: 6px!important;
}
.font-size-16{
    font-size: 16px!important;
    padding: 6px!important;
}
.font-size-28{
    font-size: 28px!important;
}
.font-color-y{
    color: #be910a!important;
}
.font-color-r{
    color: #FA5838!important;
}
.font-color-g{
    color: #10c469!important;
}
.font-color-p{
    color: #25628f!important;
}
.disabled-btn {
    pointer-events: none; /* Prevent interaction */
    opacity: 0.5; /* Make it look disabled */
    cursor: not-allowed; /* Change the cursor to a 'not-allowed' icon */
}

.hopscotch-bubble-container {
    direction: rtl;
    text-align: right;
	padding-bottom: 35px !important;
}

.hopscotch-content {
    direction: rtl;
    text-align: right;
}

.hopscotch-title {
    direction: rtl;
    text-align: right;
}

.hopscotch-next, .hopscotch-prev, .hopscotch-done, .hopscotch-skip {
    direction: rtl;
    text-align: center;
}

div.hopscotch-bubble .hopscotch-bubble-content {
    margin: 0 50px 0 0px!important;
}
.hopscotch-bubble-number {
    direction: rtl;
    text-align: left!important;
    float: right!important; /* Moves the number to the left to fit RTL layout */
	padding: 0 0 0 10px!important;
	padding: 0 10px 0 0;
}
div.hopscotch-bubble .hopscotch-nav-button{
	float: left;
}
div.hopscotch-bubble h3{
	margin: -1px 0px 0 0!important;
}
div.hopscotch-bubble .hopscotch-nav-button.next{
	float: right;
	margin-right: 10px!important;
}

div.hopscotch-bubble .hopscotch-nav-button.prev{
	float: right;
}
div.hopscotch-bubble .hopscotch-bubble-number {
    border-radius: 0%;
}
div.hopscotch-bubble .hopscotch-actions{
	float: left;
	margin: 10px 0 10px 0!important;
    text-align: right;
}
.add-timeg {
    margin-left: auto; /* Push the button to the right */
    display: inline-block;
    align-items: center;
    background-color: #28a745; /* Bootstrap success color */
    color: white;
    border: none;
    padding: 10px 15px; /* Padding for button */
    cursor: pointer; /* Pointer cursor on hover */
    transition: background-color 0.3s; /* Smooth transition for hover effect */
	height: 37px;
	margin: 0 10px;
	margin-top: -8px;
}

.add-timeg:hover {
    background-color: #218838; /* Darker shade on hover */
}
.group-time-entry{
	position: relative;
}
.group-name-input{
	padding: 0 10px;
	width: 20%;
    margin-top: 20px;
}
.icon {
    font-size: 1.2em; /* Increase icon size */
    margin-right: 5px; /* Space between icon and text */
}
.card-hover:hover {
    webkit-transform: translateY(-4px) scale(1.01);
    -moz-transform: translateY(-4px) scale(1.01);
    -ms-transform: translateY(0) scale(1.01);
    -o-transform: translateY(0) scale(1.01);
    transform: translateY(0) scale(1.01);
    -webkit-box-shadow: 0 14px 24px rgb(62 57 107 / 10%);
    box-shadow: 0 14px 24px rgb(62 57 107 / 10%);
}

.card-hover {
    -webkit-transition: all .25s ease;
    -o-transition: all .25s ease;
    -moz-transition: all .25s ease;
    transition: all .25s ease;
}
.bg-lred{
    background-color: #F9E7EB;
}
.bg-lgreen{
    background-color: #C5F7CB;
}
.bg-lyellow{
    background-color: #FFEDC9;
}
.bg-lpperpule{
    background-color: #DDD8FD;
}
.bg-lplightblue{
    background-color: #35b8e075;
}
.bg-lplightyellow{
    background-color: #ffc10752;
}
.modal-footer>:not(:first-child) {
    margin-left: 9.25rem!important;
}
#add_notification .modal-footer>:not(:first-child) {
    margin-left: 0rem!important;
}
#add_notification .modal-footer>:not(:first-child) {
    margin-left: 0rem!important;
}
#add_alert_form .modal-footer>:not(:first-child) {
    margin-left: 0rem!important;
}
#add_fsupport .modal-footer>:not(:first-child) {
    margin-left: 0rem!important;
}
#speedDialModal .modal-footer > :not(:last-child) {
    margin-left: 0rem;
}
#speedDialModal {
    top: 25%;
}
#speedDialModal #action{
    margin-left: 0!important;
}
.speedDial #select2-organizations-container{
    direction: rtl;
    text-align: right;
}
.speedDial #select2-speedtype-container{
    direction: rtl;
    text-align: right;
}

.pointer{
    cursor: pointer;
}
.addact{
    top: 20px;
}
.aligneto{
    margin: 0 20%;
    cursor: pointer;
}
#twoFA option {
  direction: rtl;
  text-align: right;
}
/*============================*/
.miniPBX .btn-group, .btn-group-vertical {
    position: relative;
    vertical-align: middle;
    flex-direction: row;
	display: inline-block;
}
.miniPBX .btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.miniPBX .btn-group>.btn-group:not(:first-child), .btn-group>.btn:not(:first-child) {
    margin-left: -1px;
}
.miniPBX .btn-outline-primary:hover{
    color: white;
}
.miniPBX .br-first {
	padding-left: 5px!important;
	margin-left: 5px !important;
}
.miniPBX .btn-check:active+.btn-outline-primary, .btn-check:checked+.btn-outline-primary, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show, .btn-outline-primary:active {
    color: #fff;
    background-color: #0d6efd;
    border-color: #0d6efd;
}
.miniPBX .edit-input{
	height: 20px !important;
    border: none !important;
    margin-left: 0 !important;
    padding: 0 10px;
    width: 70%;
	color: #474343;
}

.miniPBX .btn-toggle:active+.btn-outline-primary, .btn-check:checked+.btn-outline-primary, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show, .btn-outline-primary:active {
    color: #fff;
    background-color: #0d6efd;
    border-color: #0d6efd;
}

.btn-outline-primary{
   width: 250px;
}
.btni{
	padding: 1px 5px !important;
    margin-top: 1px;
	margin-right: 14px!important;
}
.w3-animate-zoom{
	margin: 15.75rem auto !important;
}
.miniPBX .btn-group-vertical>.btn, .btn-group>.btn {
    position: relative;
    flex: 1 1 auto;
}
.miniPBX .btn-check {
    position: absolute;
    clip: rect(0,0,0,0);
    pointer-events: none;
}
.miniPBX .btn-toggle {
    position: absolute;
    clip: rect(0,0,0,0);
    pointer-events: none;
}
.miniPBX .btn-group>.btn-group:not(:first-child)>.btn, .btn-group>.btn:nth-child(n+3), .btn-group>:not(.btn-check)+.btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.miniPBX .btn-group>.btn-group:not(:first-child), .btn-group>.btn:not(:first-child) {
    margin-left: -1px;
}
.miniPBX .btn-group-vertical>.btn, .btn-group>.btn {
    position: relative;
    flex: 1 1 auto;
}
.miniPBX .btn-outline-primary {
    color: #0d6efd;
    border-color: #0d6efd;
}
.miniPBX svg{
    margin-left: 10px;
}

.miniPBX-col-3{
    width: 25%;
    float: right;
}
.extext{
    font-size: 0.9rem!important;
    width: 11rem;
    text-align: right;
}
.hidediv{
    display: none;
}
.minheight-250{
    min-height: 250px;
}
.minheight-450{
    min-height: 450px;
}
#secnav{
    display: none;
    overflow-y: auto;
    overflow-x: hidden;
}

.list-cond-des{
    position: relative;
    top: -10px;
}
.list-cond-des span{
    width: 250px!important;
    display: inline-block;
    text-align: center;
}
.queuelink{
    cursor: pointer;
}
.queuespan{
    margin-left: 6px;
    position: relative;
    top: -4px;
}
.queuediv{
    position: absolute;
    z-index: 1;
    left: 20px;
    top: 0;
}
.dragedit{
    float: right;
    width: 250px;
    display: none;
}
.miniTitle {
    margin-right: 3px;
}
.actionTitle{
    display: flex;
    width: 100%;
}
.highlight {
    border: 1px solid red; 
    background-color: #FFD2D2; 
}
.save-cond{
    display: none;
    float: right;
    width: 100%;
	left: -85px;
}
#delete-cond{
    left: 25px;
    position: relative;
}
#save-cond1{
    display: none;
}

#edit-cond{
    display: none;
    margin-left: -38px;
}
.edit-cond-button{
    width: 100%;
    float: left;
}
#records{
	text-align: right;
    padding: 30px;
	display: inline-block;
	padding-top: 0!important;
}
.ischecked {
	background: red!important;
	color: white!important;
}
.systemrec {
	border-style: dashed;
	border-color: #f26d6d!important;
}
.add-recording{
	height: 36px;
    margin-top: -10px;
}
.modal-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.upload-modal {
  background: #fff;
  border-radius: 12px;
  padding: 20px 20px 0 20px;
  width: 500px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
  font-family: Arial, sans-serif;
}

.upload-modal .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 0;
}

.upload-modal .modal-header h3 {
  margin: 0;
  font-size: 18px;
}

.upload-modal .close-modal {
  background: none;
  border: none;
  font-size: 28px;
  font-weight: normal;
  cursor: pointer;
}

.upload-modal .dropzone {
  border: 2px dashed #ccc;
  padding: 60px;
  text-align: center;
  border-radius: 10px;
  background-color: #fafafa;
  cursor: pointer;
  transition: border-color 0.3s ease;
}
.upload-modal .dropzone:hover {
  border-color: #28a745;
  background-color: #f0fff5;
}

.upload-modal .dropzone p {
  margin: 0;
  color: #777;
}
.upload-modal .dropzone input[type="file"] {
  position: absolute;
  top: 0; left: 0;
  width: 100%; 
  height: 65%;
  opacity: 0;
  cursor: pointer;
}

.upload-modal .dropzone.dragover {
  border-color: #28a745;
  background: #f9fff9;
}

.upload-modal .file-list {
  list-style: none;
  padding: 0;
  margin-top: 20px;
  max-height: 200px;
  overflow-y: auto;
  margin-bottom: 0;
}

.upload-modal .file-list li {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  padding: 8px 12px;
  border: 2px solid #ccc;
  background-color: #f0fff5;
  border-radius: 6px;
  font-size: 0.95rem;
  color: #333;
}

.upload-modal .modal-footer {
  display: flex;
  justify-content: space-between;
}
.uploaded-files{
	position: relative;
}
.uploaded-files audio{
	height: 25px;
    position: absolute;
    left: 44px;
    width: 225px;
	margin-top: 2px !important;
}
.uploaded-files .fa-microphone{
	margin-left: 10px;
}

.remove-recording{
	margin: 0 10px;
}
.edit-conditions{
    margin-top: 25px;
}
#edit-conditions1{
    display: none;
}
#edit-conditions3{
    display: none;
}

/* Overall container */
#condition-container {
    margin: 5px auto;
    padding: 15px;
    border-radius: 10px;
	gap: 20px;
    display: flex;
}
.swal2-custom-popup .select-container {
    display: flex;
    gap: 10px; /* Adjust spacing between the selects */
}

.swal2-custom-popup .form-control {
    padding: 6px; /* Adjust padding if necessary */
    min-width: 120px; /* Set minimum width for each select */
}
.swal2-custom-popup label{
	text-align: right;
	width: 100%;
}
.field-container{
	flex: 1; 
	margin-right: 10px;
}
.help-icon {
    display: inline-block;
    width: 16px;  /* Width of the icon */
    height: 16px; /* Height of the icon */
    margin-left: 5px; /* Space between the label and the icon */
    color: #007bff; /* Icon color */
    text-align: center;
    cursor: pointer; /* Change cursor to pointer on hover */
    font-weight: bold; /* Make the icon bold */
    border: 1px solid #007bff; /* Border to give it an icon-like appearance */
    border-radius: 50%; /* Make it circular */
}

.help-icon:hover {
    background-color: #f0f0f0; /* Light background on hover */
}

#delete-group-container{
	margin-top: 10px;
}
/* Styling for each row of conditions */
.condition-row {
    display: flex;
	flex-wrap: wrap;
	flex-direction: row;
    justify-content: flex-start; 
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
    padding: 15px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.2s ease-in-out;
	gap: 5px;
}
.condition-row > div {
    margin: 5px;
    min-width: 50px; /* Ensure minimum width */
	display: inline-grid;
}
.condition-row:hover {
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

.condition-row input, .condition-srow select {
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
.condition-srow{
	display: ruby;
}
/* Label styling */
.condition-row label {
    margin-right: 10px;
    font-size: 14px;
    color: #333;
    font-weight: 500;
}

/* Styling for select dropdowns */
.condition-srow select {
    padding: 7px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-size: 14px;
    background-color: #f9f9f9;
    color: #333;
    transition: border-color 0.2s ease-in-out;
	width: 100px; /* Set a fixed width for all select elements */
    max-width: 100%; /* Ensures it doesn’t overflow if inside a small container */
    box-sizing: border-box; /* Ensures padding and border are included in the width */
}
.condition-row input {
	text-align: center;
	width: 100px; /* Set a fixed width for all select elements */
    max-width: 100%; /* Ensures it doesn’t overflow if inside a small container */
    box-sizing: border-box; /* Ensures padding and border are included in the width */
}
/* Styling for the "Delete" button */
.condition-row .delete-condition {
    margin-left: 20px;
    padding: 7px 12px;
    background-color: #ff4d4d;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.2s ease-in-out;
	margin: 0 87%;
}

.condition-row .delete-condition:hover {
    background-color: #d93636;
}

/* Styling for the "Add Condition" button */
#add-condition {
    padding: 12px 20px;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 5px;
    font-size: 16px;
    cursor: pointer;
    display: block;
    margin: 20px auto;
    transition: background-color 0.2s ease-in-out;
}

#add-condition:hover {
    background-color: #45a049;
}

/* Table-like layout for select elements within the condition row */
.condition-srow select {
}

/* More space between select elements */
.condition-srow select {
}

/* Better alignment for label and select fields */
.condition-row label {
    
}
#add_condi{
	display: none!important;
}
/* Responsive layout */

button.delete-condition {
    background-color: #f44336;
}

#moutboundcid{
    width: 39%!important;
    margin-right: -2.5%;
}
textarea[name="rg_extensions"] {
   direction: ltr;
   text-align: left!important;
}
textarea[name="Notes"] {
  width: 100%;
  height: 100px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #fff;
  font-size: 16px;
  resize: none;
}

.miniPageTitle{
    margin-bottom: 30px;
}
.mdi-clock-outline{
    margin-left: 5px;
    line-height: 0px;
    color: #398439;
    top: 4px;
    position: relative;
    cursor: pointer;
}
.mdi-plus-circle-multiple-outline{
	margin-left: 10px;
}
.hidden-important {
  display: none !important;
}
.floating-add-btn {
  width: 20px;
  height: 20px;
  background-color: #000; /* Black */
  color: #fff;
  font-size: 28px;
  border: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  z-index: 9999;
  transition: background-color 0.3s ease;
}

.floating-add-btn:hover {
  background-color: #444;
}
.inner-box.card-box .tabtitle { 
    display: inline;
    margin-left: 15px;
	text-align: right;
	direction: ltr;
    width: 220px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1px 10px 3px 0;
}
#list-ecustomContent .tabtitle {
	border: none!important;
}
.mdi.mdi-circle-edit-outline{
    cursor: pointer;
}
.tabtitleedit{
    width: 215px;
    top: 8px;
    position: absolute;
    display: none;
	border: 1px solid #188ae2;
}
.show-field{
    display: block!important;
}
.dial-icon:hover {
    color: #0056b3 !important;
    transform: scale(1.1);
    transition: all 0.2s ease;
	cursor: pointer;
}

/* Custom SweetAlert-like Modal Styling */
.swal-modal {
    border-radius: 6px!important; /* Rounded edges */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1)!important; /* Subtle shadow */
    padding: 20px!important;
    background-color: #ffffff; /* Clean white background */
    border: none;
}
#incomingModal .modal-dialog {
	margin-top: 150px!important;
	z-index: 9999;
}
#incomingModal {
	z-index: 9999;
}
/* Header styling */
.swal-modal .modal-header {
    border-bottom: 1px solid #f0f0f0!important; /* Light separator */
    text-align: center;
    padding: 0 0 20px 0!important;
}

.swal-modal .modal-title {
    font-size: 22px;
    font-weight: bold;
    color: #333; /* Dark text */
}

/* Footer styling */
.swal-modal .modal-footer {
    border-top: 1px solid #f0f0f0; /* Light separator */
    text-align: center;
    padding: 20px 0;
}

/* Form Fields */
.swal-modal .form-label {
    font-weight: bold;
    color: #555;
}

.swal-modal .form-control {
    border-radius: 8px;
    box-shadow: none;
    border: 1px solid #ddd; /* Subtle border */
    padding: 10px;
    font-size: 14px;
    margin-bottom: 15px;
}

.swal-modal .form-control:focus {
    border-color: #007bff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.25);
}
.swal-modal .modal-footer>:not(:first-child) {
    margin-left: 0 !important;
}
/* Buttons */
.swal-modal .btn {
    font-weight: 600;
    padding: 10px 20px;
    border-radius: 6px;
}

.swal-modal .btn-secondary {
    background-color: #f0f0f0;
    color: #333;
}

.swal-modal .btn-primary {
    background-color: #007bff;
    color: #fff;
}

.swal-modal .btn-secondary:hover, .custom-modal .btn-primary:hover {
    opacity: 0.8;
}
#incomingSaveButton{
	margin-right: 10px;
}
/* Responsive layout */
@media (max-width: 767px) {
    .swal-modal .modal-dialog {
        max-width: 90%;
    }
    .swal-modal .form-control {
        font-size: 16px;
    }
}
.addincomingb {
    display: flex;
}

.addincomingb > .col-md-3.col-sm-3 {
    order: 1; /* First */
}

.addincoming {
    order: 2; /* Second */
	padding: 0 10px 0 20px!important;
	font-size: 14px;
	width: auto !important;
	height: 37px;
	float: left;
    margin-left: 52px;
}
.addsave{
	padding: 0 10px 0 20px!important;
	font-size: 14px;
	width: auto !important;
	height: 37px;
	bottom: 45px;
    position: relative;
    left: 45px;
	display: none!important;
}
.addincomingb > .col-md-5.col-sm-5 {
    order: 3; /* Last */
}
.addincomingb > .col-md-2.col-sm-2 {
    order: 3; /* Last */
}

/* Style the dropdown menu */
.queue-table .dropdown-menu, #waiting-table .dropdown-menu {
    display: none; /* Hidden by default */
    position: absolute; /* Position relative to td */
    left: 44%; /* Center horizontally */
    transform: translateX(-50%); /* Adjust for center alignment */
    top: 100%; /* Position below the td */
    background-color: #ffffff;
    border: 1px solid #ccc;
    border-radius: 5px;
    z-index: 1000;
    width: 150px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    padding: 0;
}

.queue-table .dropdown-menu ul, #waiting-table .dropdown-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.queue-table .dropdown-menu ul li, #waiting-table .dropdown-menu ul li {
	text-align: right;
	direction: rtl;
	border-bottom: 1px solid #e1e5f0;
}

.queue-table .dropdown-menu ul li:last-child, #waiting-table .dropdown-menu ul li:last-child {
    border-bottom: none;
}

.queue-table .dropdown-menu ul li a, #waiting-table .dropdown-menu ul li a {
    display: block;
    padding: 10px;
    color: #333;
    text-decoration: none;
	text-align: right;
	direction: rtl;
}

.queue-table .dropdown-menu ul li a:hover, #waiting-table .dropdown-menu ul li a:hover {
    background-color: #f5f5f5;
    color: #007bff;
	text-align: right;
	direction: rtl;
}
.dial-cell{
	position: relative;
}
#savetitle{
   cursor: pointer; 
   z-index: 100;
   position: relative;
}
.savetitle{
  cursor: pointer; 	
}
#savecondtitle{
   cursor: pointer; 
   z-index: 100;
   position: relative;
}
#saveIncomingtitle{
   cursor: pointer; 
}
.titleincom span{
    margin-top: 15px;
	z-index: 9999;
}
.titlecon .tabtitleedit{
	top:0px;
}
#incoming-content .titleincom span{
    margin-top: 7px;
	z-index: 9999;
}
.titlecon{
    margin-bottom: 20px;
}
.contentincon .plan-stats{
    padding: 0px 20px 15px;
}
.destIncom{
    width: 100%;
    display: flex;
}
.destIncom label{
    font-size: 16px;
    font-weight: 600;
    margin-left: 20px;
	width: 100%;
}
.destIncom .col-sm-4{
	width: 40%!important;
	flex:  40%!important;
}
.rgtextarear{
   height: 200px; 
}
#destination{
   font-size: 1rem;
    max-width: 40%;
}
#destination_detail{
   font-size: 1rem;
    max-width: 40%;
}

.mdi.mdi-link-plus{
    color: #BC0E11;
    cursor: pointer;
}
#outboundcid{
   font-size: 1rem; 
}
.miniPBX .tab-content>.tab-pane {
    min-height: 400px;
}
.tabtitleeditIn {
    width: 215px;
    top: 14px;
    position: absolute;
    display: none;
}

.form-field {
      display: flex;
      align-items: center;
      margin-bottom: 20px;
      background-color: #fff;
      border-radius: 5px;
      box-shadow: 0px 0px 5px #888888;
    }
    .fs-14[_ngcontent-yqf-c296] {
       font-size: 14px !important;
        text-align: right;
    }
    
    .mat-h5, .mat-typography h5 {
        font: 400 calc(14px * 0.83)/20px Roboto, "Helvetica Neue", sans-serif;
        margin: 0 0 12px;
    }
    .textarea-edit{
        position: absolute;
        top: 3px;
        right: 38%;
    }
    .mb-0, .my-0 {
        margin-bottom: 0 !important;
    }
    .text-al-right{
        text-align: right;
		direction: ltr;
    }
    hr {
        margin-top: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }
/*============================*/

.input-sm select {
  background-color: #0563af;
  color: white;
  padding: 12px;
  width: 250px;
  border: none;
  font-size: 20px;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
  -webkit-appearance: button;
  appearance: button;
  outline: none;
}

.input-sm::before {
  content: "\f13a";
  font-family: FontAwesome;
  position: absolute;
  top: 0;
  right: 0;
  width: 20%;
  height: 100%;
  text-align: center;
  font-size: 28px;
  line-height: 45px;
  color: rgba(255, 255, 255, 0.5);
  background-color: rgba(255, 255, 255, 0.1);
  pointer-events: none;
}

.input-sm:hover::before {
  color: rgba(255, 255, 255, 0.6);
  background-color: rgba(255, 255, 255, 0.2);
}

.input-sm  option {
  padding: 30px;
 font-size: 14px!important;
}
.showcost{
    float: left;
}
#am_aplicacion_show{
    position: absolute;
    right: 227px;
    top: 0;
}
#am_aplicacion_done{
    position: absolute;
    right: 357px;
    top: 0;
}

#am_aplicacion_type{
    position: absolute;
    right: 451px;
    top: 0;
}

#am_aplicacion_read{
    position: absolute;
    right: 571px;
    top: 0;
}
#am_aplicacion_cats{
    position: relative;
    right: 225px;
    top: 75px;
    z-index: 1;
}
#am_aplicacion_id_catss{
    height: 36px;
}
#am_aplicacion_id_cats{
    height: 34px;  
}
#am_aplicacion_catss{
    width: 100%;
    margin-top: 7px;
}
#am_aplicacion_cat{
    position: absolute;
    display: none;
    right: 571px;
    top: 0;
}
#am_aplicacion_inform{
    position: absolute;
    display: none;
    right: 571px;
    width: 125px;
    top: 0;
}
#am_aplicacion_ext{
    position: absolute;
    right: 220px;
    top: 0;
}
#am_aplicacion_atype{
    position: absolute;
    min-width: 150px;
    max-width: 150px;
    right: 360px;
    top: 0;
}

#am_aplicacion_etype{
    position: absolute;
    right: 507px;
    top: 0;
}
#am_aplicacion_urgency{
    position: absolute;
    right: 668px;
    top: 0;
    z-index: 1;
}
#allmessage-datatable_length{
    left: auto!important;
    top: -5px;
}
#next-stage{
    display: none;
}
#delete-all-btn:hover ~ span {
    font-size: 18px;
	font-weight: bold;
}
.accounting-table tr:hover th .btn-primary {
    color: #fff!important;
    font-size: 14px;
}
.accounting-table tr:hover th .btn-danger{
    color: #fff!important;
    font-size: 14px;
}
.accounting-table tr:hover th .btn-purple{
    color: #fff!important;
    font-size: 14px;
}
.accounting-table tr:hover td .badge-success {
    color: #fff!important;
    font-size: 12px!important;
    padding: 3px 5px;
}
.accounting-table tr:hover td .badge-danger{
    color: #fff!important;
    font-size: 12px!important;
    padding: 3px 5px;
}
.accounting-table tr:hover td .badge-purple{
    color: #fff!important;
    font-size: 12px!important;
    padding: 3px 5px;
}
.accounting-table tr:hover th .adduser{
    padding: 2px!important;
}
.accounting-table tr th .adduser{
    padding: 0px!important;
}
.mlr-0{
    margin-left: 0!important;
    margin-right: 0!important;
}
#massdelete{
    margin-left: 0;
    display: none;
}
.table thead th{
    font-size: 13px;
    padding: 5px;
}
.table thead th:hover{
    font-size: 13px;
    padding: 5px;
}
.display{
	display: inline-block!important;
}
.pbxnav .pricing-column{
	margin-bottom: 0;
}
.pbxnav .pricing-column .inner-box{
	padding: 0;
}
#product_data_search th{
    border: none;
}
#product_data_search{
    border: none;
}
#product_data .badge.badge-purple{
    width: 100%;
    text-align: center;
}
.rtl .w-100 {
    text-align: right;
}
.ispaid {
    place-content: center;
    width: 17px;
    height: 17px;
    margin-left: 10px;
    float: right;
    position: absolute;
    top: 41%;
}
.p-r-10{
    padding-right: 15px;
    text-align: right;
}
.p-r-28{
    padding-right: 28px;
    text-align: right;
}
.ispaidlbl{
    float: right;
    position: absolute;
    top: 40%;
    margin: 0 25px;
}
#product_data .badge.badge-info{
    width: 100%;
    text-align: center;
    
}

#massedit{
    display: none;
}
.dmassedit{
    display: none;
}
.deleteb{
   position: absolute;
   left: 10%;
   top: 16px; 
}
.cdeleteb{
   position: absolute;
   left: 19%;
   top: 16px; 
}
.icon.glyphicon.input-group-addon.glyphicon-search{
	right: 152px;
    top: 12px;
    height: 19px;
    z-index: 2;
}
.acc-title{
	height: 35px;
}
.accounting .bootgrid-header {
    padding-top: 73px;
}
.mr-10{
	margin-right:10px;
}
.m-b-45{
	margin-bottom: 45px!important;
}
.m-l-r-15{
	margin:0 10px;
}
#customs-modal{
	margin-top: 128px;
}
.custom-modal-cam{
	width: 50%!important;
	height:800px!important;
    margin: 10% auto;
	background-color: #FFF;
    border-radius: 4px;
	display:none;
}
.custom-modal-cam .modal-body{
	height:317px;
}
#super-modal.custom-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%!important;
    height: 90%!important;
    border-radius: 5px;
    padding: 20px;
    text-align: center;
    height: auto!important;
    min-height: 700px;
    z-index: 99999;
    transition: opacity 0.3s, transform 0.3s;
}
#super-modal.custom-modal-text {
   height: 490px;
}
#super-modal.modal-content {
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: none;
}
#ChoosePbx .custom-modal{
    margin-top: 20%;
    max-width: 400px;
}
#ChoosePbx .close_design{
    top: -17px;
    left: -17px;
}
#ChoosePbx .modal-footer>:not(:first-child){
    margin-left: 0!important;
}

#CompareNumbers .custom-modal{
    margin-top: 13%;
	width: 80%;
    max-width: 1200px;
}
#CompareNumbers .close_design{
    top: -17px;
    left: -17px;
}
#CompareNumbers .modal-footer>:not(:first-child){
    margin-left: 0!important;
}

#open-modal {
    cursor: pointer;
}
#close-modal {
    margin-top: 10px;
}

.custombox-modal-container{
  max-height: 700px;
}
#super-modal .custombox-modal-container{
  max-height: 700px;
  overflow-x: auto;
  overflow-y: hidden;
}
#super-modal #extensions-table_wrapper{
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 700px;
}
#super-modal #extensions-table_wrapper::-webkit-scrollbar {
    width: 3px; /* Set the width of the scrollbar */
}

#super-modal #super-modal #extensions-table_wrapper::-webkit-scrollbar-thumb {
    background-color: #188ae2; /* Color of the scrollbar thumb */
}
#comments-list::-webkit-scrollbar {
    width: 3px; /* Set the width of the scrollbar */
}
#textEditor::-webkit-scrollbar {
    width: 3px; /* Set the width of the scrollbar */
}
#super-modal .custombox-modal-container{
    margin-top: 0!important;
}
#super-modal .mdi-cloud-upload{
    font-size: 16px;
}
#openimport{
    float: left;
}
#super-modal .dataTables_filter{
    margin-top: 15px;
    margin-bottom: 5px;
}
#super-modal .dataTables_length{
    margin-top: 15px;
    margin-bottom: 5px;
    left: 0;
}
#super-modal .btn-danger.btn-rounded{
    position: absolute;
    right: 27%;
    margin-top: 14px;
}
#super-modal #delete-selected-rows{
    position: absolute;
    right: 55%;
    margin-top: 14px;
}
#super-modal #extensions-table_wrapper{
    position: relative;
}

.modal.active {
    display: block;
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}
user agent stylesheet
select {
    border-radius: 5px;
}
.span-success {
    background-color: #10c469 !important;
    border: 1px solid #10c469 !important;
	padding:2px;
	color:#fff;
}
#tech-companies-1 th:first-child{
	text-align:right!important;
}
#tech-companies-1 td:first-child{
	text-align:right;
}
#noti{
	display:none;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.select2-container .select2-selection--multiple .select2-selection__choice {
    background-color: #25628f!important;
	border: 1px solid #25628f!important;
}
.select2-selection__choice__remove{
	color:#fff!important;
}
.select2-container--default .select2-selection--multiple .select2-selection__clear {
    cursor: pointer;
    float: left!important;
    font-weight: bold;
    margin-top: 0!important;
	margin-bottom: -6px;
    margin-right: 10px;
	font-size:23px;
}
.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
    float: left;
    margin-right: 9px!important;
}
.gradient-green, .header-actions>li .user-settings .avatar .status.online, .alert.alert-success, .nav-tabs .nav-link.active {
    background: #49914E;
    background: linear-gradient(
45deg,#49914E 0%,#B2D553 100%);
    color: white;
}
.gradient-blue2 {
    background: #0874af;
    background: linear-gradient(
45deg,#0874af 0%,#6cbce8 100%);
}
.gradient-violet-pink {
    background: #216ED8;
    background: linear-gradient(
45deg,#216ED8 0%,#FA7799 100%);
}
.gradient-orange2 {
    background: #FF504B;
    background: linear-gradient(
45deg,#FF504B 0%,#FEA061 100%);
}
.gradient-violet3 {
    background: #201F8E;
    background: linear-gradient(
45deg,#201F8E 0%,#7170e8 100%);
}
.gradient-grey3 {
    background: #bfbfbf;
    background: linear-gradient(
45deg,#bfbfbf 0%,#ffffff 100%);
}
.gradient-violet3 {
    background: #201F8E;
    background: linear-gradient(
45deg,#201F8E 0%,#7170e8 100%);
}
.gradient-teal-cream {
    background: #0D95AD;
    background: linear-gradient(
45deg,#0D95AD 0%,#FFD2C1 100%);
}
.gradient-teal-brown {
    background: #3797A1;
    background: linear-gradient(
45deg,#3797A1 0%,#BC805A 100%);
}
.gradient-yellow, .header-actions>li .user-settings .avatar .status.away, .alert.alert-warning {
    background: #e78000;
    background: linear-gradient(
45deg,#e78000 0%,#ffd26a 100%);
}
.widget-box-2 .widget-detail-2 .badge{
	padding: 3px 10px;
	direction:ltr;
}
.widget-box-2 .widget-detail-2{
	min-height:87px;
}
.widget-detail-2{
	text-align:center!important;
	padding-top:1px;
}
.card-dark{
	color:#111111;
}
.card-box .mdi.mdi-dots-vertical{
	color:#fff;
}

.send_email_form .mdi.mdi-arrow-collapse-right{
    text-align: left;
    float: left;
    position: absolute;
    left: 5px;
    color: #188ae2;
}
.header-title.mt-0.wellcome-title{
	text-align:right!important;
}
.mt-0.title-status{
	text-align:right!important;
}
#agentname option:after {
    content: " ";
    height: 5px;
    width: 5px;
    border-radius: 5px;
    display: inline-block;
}
.select2-search__field{
	display:block!important;
	padding-right:20px!important;
}
user agent stylesheet
input, textarea, select, button {
    text-rendering: auto;
    color: initial;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    margin: 0em;
    font: 400 13.3333px Arial;
	border: none;
    background: none;
}
.swal2-html-container .mdi-help-circle-outline {
    color: #286090;
    margin-left: 3px;
    cursor: help;
	left: -3px;
    right: auto;
	font-size: 15px;
	position: relative;
}
.swal2-container .mdi-help-circle-outline {
    color: #286090;
    margin-left: 3px;
    cursor: help;
    left: -3px;
    right: auto;
    font-size: 15px;
    position: relative;
}
.button-container {
    display: flex;
    margin-left: 10px;
}

.add-time, .remove-time, .add-day, .remove-day, .add-daymonth, .remove-daymonth, .add-month, .remove-month {
    background-color: #4CAF50; /* Green background */
    border: none;
    color: white; /* White text */
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 4px;
	min-width: 30px; 
}

.remove-time, .remove-day, .remove-daymonth, .remove-month{
    background-color: #f44336; /* Red background */
}
.list-inline.mb-0.fleft{
	margin-left:26px;
	cursor:pointer;
}
#switchboard_upload{
	margin-right:15px;
}
#user-list-calls .list-group-item{
	padding:10px;
}
#user-list-calls .user-desc .time{
	padding-right: 0;
	float:right;
}
#user-list-calls .user-descs .time{
	padding-right: 0;
	float:right;
}
.lightwhite{
	background:ghostwhite
}
.grey{
	background:#d2eaff;
	
}
.red{
	background:#eccacb;
}
#responsive-datatable{
	
}

#tasks-datatable td{
	color: #141414;
    padding: 15px 0 12px 0!important;
    font-size: .9rem;
}
#tasks-datatable > thead > tr > th {
    background: #f9c851;
    padding: 10px 0;
}
#debitcredit-datatable td{
	color: #141414;
    padding: 15px 0 12px 0!important;
    font-size: .9rem;
}
#debitcredit-datatable > thead > tr > th {
    background: #CC3B3B;
    padding: 10px 0;
}
#inform-datatable td{
	color: #141414;
    padding: 15px 0 12px 0!important;
    font-size: .9rem;
}
#inform-datatable > thead > tr > th {
    background: #10c469;
    padding: 10px 0;
}
#inform-datatable_info{
    padding-top: 0;
    color: #141414;
    margin-top: 10px;
    background: white;
    width: 100%;
}
#tasks-datatable_info{
    padding-top: 0;
    color: #141414;
    margin-top: 10px;
    background: white;
    width: 100%;
}
#messages-datatable_info{
    padding-top: 0;
    color: #141414;
    margin-top: 10px;
    background: white;
    width: 100%;
}

#messages-datatable td{
	color: #141414;
    padding: 15px 0 12px 0!important;
    font-size: .9rem;
}
#messages-datatable > thead > tr > th {
    background: #35b8e0;
    padding: 10px 0;
}
#files-datatable td{
	color: #25628f;
    padding: 15px 0 12px 0!important;
    font-size: .9rem;
}
#files-datatable > thead > tr > th {
    background: #25628f;
    padding: 10px 0;
}
#tasks-datatable_filter{
   margin-bottom: 10px; 
}
#messages-datatable_filter{
   margin-bottom: 10px; 
}
#inform-datatable_filter{
   margin-bottom: 10px; 
}

#tasks-datatable_filter label{
   padding-right: 0;
}
#messages-datatable_filter label{
   padding-right: 0;
}
#inform-datatable_filter label{
   padding-right: 0;
}
.highlight-pro {
    background-color: #d4edda !important; /* Light green */
}

.highlight-charge {
    background-color: #f8d7da !important; /* Light red */
}
.rtl #tasks-datatable_wrapper .dataTables_length{
   left: -2%;
}
.rtl #messages-datatable_wrapper .dataTables_length{
   left: -2%;
}
.rtl #inform-datatable_wrapper .dataTables_length{
   left: -2%;
}
.help-tour{
    position: absolute;
    right: 10%;
    left: auto;
    top: 16px;
}
.help-tour i{
    color: white;
    cursor: pointer;
}
.rtl .help-tour{
    position: absolute!important;
    left: 10%;
    right: auto;
    top: 16px;
}
.rtl .help-tour i{
    color: white;
    cursor: pointer;
}
#actreport{
	z-index: 999;
}
#actreport .modal-dialog{
    margin: 11.75rem auto;
    max-width: 90%;
}
#actreport .modal-content{
    
}
#actreport .close{
    left: 38px;
}
#price-div{
	display: none;
}
.form-check-input{
	margin-right: -1.25rem !important;
}
#categorieslist .modal-dialog{
    margin: 11.75rem auto;
    max-width: 90%;
}
#categorieslist .modal-content{
    
}
#categorieslist .close{
    left: 38px;
}

#flowchart-modal .close{
    left: 38px;
}
#flowchart-modal .modal-dialog {
    margin: 11.75rem auto!important;
    max-width: 90%;
}
#clear-all{
    position: absolute;
    right: 805px;
    padding: 5px;
}
#clear-all .mdi{
    margin-left: 0!important;
    height: 16px;
    position: relative;
    top: -1px;
}
.support{
    position: absolute;
    right: 13%;
    left: auto;
    top: 16px;
}
.support i{
    color: white;
    cursor: pointer;
}
.rtl .support{
    position: absolute!important;
    left: 13%;
    right: auto;
    top: 16px;
}
.rtl .support i{
    color: white;
    cursor: pointer;
}
.divx.support{
    position: relative!important;
    left: auto!important;
    right: auto!important;
    top: 0!important;
}

/* The container must be positioned relative: */
.table-responsive {
  position: relative;
  font-family: Arial;
}

.table-responsive select {
  display: none; /*hide original SELECT element: */
}
.taskslist .table-responsive select {
  display: block; 
}
.col-md-12.box .table-responsive select {
  display: block; 
}
.card-box.table-responsive select {
  display: block; 
}
#INVtype {
  display: block; /*hide original SELECT element: */
}
.dataTables_length select{
    display: inline-block!important;
}
.select-selected {
  background-color: DodgerBlue;
}

/* Style the arrow inside the select element: */
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

/* style the items (options), including the selected item: */
.select-items div,.select-selected {
  color: #ffffff;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: DodgerBlue;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover, .same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}
.notification-icon {
    width: 48px; /* Adjust the width to your desired size */
    height: 48px; /* Adjust the height to your desired size */
}
.blue-font{
    color: #0F78C4;
    font-size: 19px!important;
}
.blue-font-big{
    color: #0F78C4;
    font-size: 28px!important;
}
.white-font{
    color: #fff!important;
}
.grey-font{
    color: #b7c3c9;
    font-size: 19px!important;
}
.green-font{
    color: #10c469!important;
    font-size: 19px!important;
}
.orange-font{
    color: #10c469;
    font-size: 19px!important;
}
.green-font-big{
    color: #10c469!important;
    font-size: 28px!important;
}
.red-font{
    color: red!important;
    font-size: 20px!important;
}
.pointer{
    cursor: pointer;
}
.yellow-font{
    color: #f9c851!important;
    font-size: 30px!important;
}
.blues-font{
    color: #188ae2!important;
    font-size: 30px!important;
}
.red-fonts{
    color: #F0080C;
    font-size: 30px!important;
}
.mdi-attachment{
    float: left;
    margin-left: 5px;
}
.lgreen-font{
    color: #36D71D!important;
    font-size: 30px!important;
}
.tdnopadding { 
   padding: 0!important;
}
#allmessage-datatable td {
    position: relative;
    vertical-align: middle;
}
#allmessage-datatable td:last-child {
    display: inline-table;
    width: 103px;
}
.mdi-calendar-edit.green-font{
    float: left!important;
    margin-left: 5px;
}
#incoming-content .btn-purple{
    float: left;
    padding: 0.5em 0.8em!important;
	height: 42px;
}
#incoming-content .btn-purple span{
    float: left;
}
#incoming-content .btn-purple i{
    font-size: 15px;
}
.start-work{
    display: grid;
}
.started-work{
    display: grid;
}
.active .badge.badge-warning {
    color: #141414;
    background: white;
}
.user-desc span{
	text-align:right!important;
}
.user-descs span{
	text-align:right!important;
}
.card-body textarea {
    white-space: nowrap;
	min-height:auto!important;
    width: 100%;
    font-size: 15px;
    line-height: 20px;
	text-align:left!important;
	direction:ltr;
}
.form-group.mb-0 textarea {
	text-align:right!important;
}

.logo.header-user{
	float:left;
	position: relative;
    top: 20px;
    left: 10px;
}
.navigation-menu.header-user{
	position: relative;
    top: 17px;
    right: 35px;
}
.menu-extras.topbar-custom .app-search .form-control, .app-search ::placeholder{
    color: white!important;
}
.header-user .profile-dropdown{
   right: 0px!important;
}
.kanban-box{
	padding: 20px;
    -webkit-box-shadow: 0 0px 8px 0 rgb(0 0 0 / 6%), 0 1px 0px 0 rgb(0 0 0 / 2%);
    box-shadow: 0 0px 8px 0 rgb(0 0 0 / 6%), 0 1px 0px 0 rgb(0 0 0 / 2%);
    border-radius: 5px;
    margin-bottom: 20px;
    background-color: #ffffff;
}
.m-t-0{
	margin-top:0!important;
}
.m-t-50{
	margin-top:50px!important;
}
.m-t-35{
	margin-top:35px!important;
}
.m-t-25{
	margin-top:24px!important;
}
.m-b-0{
	margin-bottom:0!important;
}
.m-t--10{
	margin-top:2px!important;
}
.m-t--12{
	margin-top:-12px!important;
}
.m-t-130 {
    margin-top: 130px !important;
}
.m-l-0{
	margin-left:0px!important;
}
.p-r-0{
	padding-right:0px!important;
}
.p-l-0{
	padding-left:0px!important;
}
.p-30{
	padding: 30px;
}
.p-b-20{
	padding-bottom: 20px;
}
.m-r-0{
	margin-right:0px!important;
}
.m-t-7{
	margin-top:7px!important;
}
.m-b-10{
    margin-bottom:10px!important;
}
.client .m-t--10{
	margin-top:0px!important;
}
#punchclock-datatable.table > thead > tr > th {
    vertical-align: bottom;
    border-color: #ebeff2 !important;
    padding: 5px;
    background: #188ae2;
    color: #141414;
    text-align: center !important;
    border-bottom-color: #dee2e6 !important;
    border-bottom-width: 2px !important;
    max-width: 12rem;
}
#allmessage-datatable.table>:not(caption)>*>* {
    padding: 0.85rem 0.85rem;
    background-color: var(--ct-table-bg) !important;
    border-bottom-width: 1px !important;
    -webkit-box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg) !important;
    box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg) !important;
    border-bottom-color: #dee2e6 !important;
    border-right-width: 0;
}
#punchclock-datatable.table>:not(caption)>*>* {
    padding: 0.85rem 0.85rem;
    background-color: var(--ct-table-bg) !important;
    border-bottom-width: 1px !important;
    -webkit-box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg) !important;
    box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg) !important;
    border-bottom-color: #dee2e6 !important;
    border-right-width: 0;
}
.card-body textarea.form-control.multiline {
    white-space: normal;
}
.card-space .switch{
	float:left;
}
.show{
	margin-top: -11px;
}
.show .mdi{
	font-size:20px;
}
.phone-image{
	padding-left: 30px;
	position: relative;
    top: -2px;
	cursor:pointer;
}
.phone-call{
	display:none;
}
.content-page .content {
    margin-top: 85px !important;
  }
.vcontent-page .content {
	margin-top: 75px !important;
}
.topbar-right-menu{
	margin-top: -10px;
}
.titlesearch{
	width:100%;
	padding: 0 15px;
	font-size: 14px;
}
.statusselect{
	position: absolute;
    top: 29px;
    left: 15%;
    z-index: 1;
}
#installButton {
    padding: 10px 20px;
    font-size: 16px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 20px;
}

#installButton:hover {
    background-color: #0056b3;
}

#installMessage {
    font-size: 14px;
    color: #555;
    margin-top: 20px;
}
#product_data_search th{
	vertical-align: bottom;
    border-color: #ebeff2!important;
    padding: 5px;
    background: #fff;
    color: #fff;
    text-align: center!important;
}

.font-12 span{
    font-size: 12px!important;
}

.font-13 span{
    font-size: 13px!important;
}

.font-14 span{
    font-size: 14px!important;
}

.font-15 span{
    font-size: 15px!important;
}

.font-16 span{
    font-size: 16px!important;
}
.font-17 span{
    font-size: 17px!important;
}
.font-18 span{
    font-size: 18px!important;
}
.font-23 {
    font-size: 23px!important;
}
.waitingtime{
    padding-top: 0!important;
    padding-bottom: 0!important;
    margin-top: -3px;
    color: red!important;
    font-size: 80%!important;
}
.widget-chart-1{
  height:80px;
}
.btnposition{
	position: absolute;
    top: 10px;
    left: 20px;
}
.btntypeposition{
	position: absolute;
    top: 10px;
    left: 75px;
}
.btnpos{
	position: absolute;
    bottom: 28px;
    right: 20px;
}
tspan{
	font-family: "Karla", sans-serif!important;
	font-size:13px!important;
}
text{
	font-family: "Karla", sans-serif!important;
	font-size:13px;
}
.fa.fa-file-pdf-o{
	margin-left:5px;
}
.fa.fa-coffee{
	margin-left:0;
}
.fa.fa-pause{
	margin-left:0;
}

.fa-solid.blue{
	color:#188ae2;
	cursor:pointer;
}
.fa-solid.green{
	color:#090;
	cursor:pointer;
}
.fa-solid.red{
	color:#B8213C;
	cursor:pointer;
}
.title-status{
}
.display{

}
.displays{
  display:block!important;
}

.ml-35{
	margin-left:35px;
}
.loader-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999999999;
}

.loader {
  border: 16px solid #f3f3f3; /* Light gray */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 80px;
  height: 80px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
#rg_extensions {
    max-height: 100px;
    max-width: 60%;
    overflow: auto;
    word-wrap: break-word;
}
.btn-white {
    color: #141414;
    background-color: #fff;
    border-color: #AFB5B9;
}
.btn-white:not(:disabled):not(.disabled).active, .btn-white:not(:disabled):not(.disabled):active, .show>.btn-white.dropdown-toggle {
    color: #141414;
    background-color: #fff;
    border-color: #AFB5B9;
}
.btn-white:hover {
    color: #fff;
    background-color: #5a6268;
    border-color: #AFB5B9;
}

.btn-grey {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
}
.btn-grey:not(:disabled):not(.disabled).active, .btn-grey:not(:disabled):not(.disabled):active, .show>.btn-grey.dropdown-toggle {
    color: #fff;
    background-color: #545b62;
    border-color: #4e555b;
}
.btn-grey:hover {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}

.btn-green {
    color: #141414;
    background-color: #91E5AD;
    border-color: #B7B9BB;
}
.btn-green:not(:disabled):not(.disabled).active, .btn-green:not(:disabled):not(.disabled):active, .show>.btn-green.dropdown-toggle {
    color: #141414;
    background-color: #91E5AD;
    border-color: #B7B9BB;
}
.btn-green:hover {
    color: #141414;
    background-color: #91E5AD;
    border-color: #B7B9BB;
}
.miniPBX .btn-warning-ok:hover {
    color: #fff!important;
    background-color: #25628f!important;
    border-color: #25628f!important;
}.miniPBX .btn-warning-ok.active{
    color: #fff!important;
    background-color: #25628f!important;
    border-color: #25628f!important;
}

.miniPBX .btn-warning-notok.active {
    color: #fff!important;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
.miniPBX .btn-warning-notok:hover {
    color: #fff!important;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
.miniPBX .btn-warning-ok {
    color: #141414!important;
    background: rgb(248,192,56);
    background: linear-gradient(90deg, rgba(248,192,56,1) 0%, rgba(145,229,173,1) 55%);
}
.miniPBX .btn-warning-notok {
    background: rgb(253,187,45)!important;
    background: linear-gradient(90deg, rgba(253,187,45,1) 0%, rgba(84,91,98,1) 55%)!important;
}
.modal-width{
	width:100%!important;
	height:700px;
	max-width: 100%;
}
.modal-widths{
	width:100%!important;
	max-width: 100%;
}
#showmypdf body{
	overflow:hidden;
}
#showmodal .modal-body{
	height:710px;
}
.modal-content-pdf{
	top:-98px;
}
.modal-header-pdf{
	padding-bottom:0!important;;
}
.modal-design{
	margin-top:18%;
	width: 25%;
}
.modal-design .close_design{
	top: -32px;
    left: 29px;
}
.modal-design .modal-title{
	font-size: 20px;
    margin-top: 0;
    color: #255976;
    font-weight: 700;
}
.modal-header .img-responsive{
	width:265px;
}
#notificationonoff{
	float:left;
}
.settings input:checked + .slider {
    background-color: #3bb54b;
}
.settings .dataTables_length{
    left: 0!important;
}
.rtl .show > .dropdown-menu{
	z-index:99999999;
	transform: translate3d(150px, 25px, 0px)!important;
	display:none;
}
.rtl .show.open > .dropdown-menu{
	z-index:99999999;
	transform: translate3d(150px, 25px, 0px)!important;
	display:block;
}
.rtl .dropdown-item{
	text-align:right!important;
}
user agent stylesheet
input, textarea, select, button, meter, progress {
    -webkit-writing-mode: horizontal-tb !important;
}
.license-intremark{
	word-break: break-all;
}
.editexremark{
	float: left!important;
    margin-top: 12px;
    font-size: 14px!important;
    cursor: pointer;
}
.license-remark{
	font-size:12px;
	height: 10px;
    width: 100%;
}
.svgsettings{
    text-align: center;
}
.ext_Remark{
	border: none!important;
    background: #fff!important;
	width: 82%;
}
.editextremark{
	float:left!important;
	cursor:pointer;
    margin-top: 10%;
}
.int_Remark{
	word-break: break-all;
	border: none!important;
    background: #fff!important;
	height: 30px;
    width: 90%;
    overflow: hidden;
}
.deduct{
	word-break: break-all;
	border: none!important;
    background: #fff!important;
	height: 30px;
    width: 100%;
    overflow: hidden;
	border: 1px #ccc solid!important;
    border-radius: 3px;
    margin-right: 10px;
	padding: .375rem .75rem;
	background: #f5f5f5!important;
	display: block;
}
.imputwidth{
    width: 80px;
    width: 95px;
    margin-left: 0!important;
}
.imputswidth{
    width: 55px;
    margin-left: 0!important;
}
#cdReport .table-bordered td:nth-child(2){
	direction:ltr;
}
#cdReport .table-bordered td:nth-child(4){
	direction:ltr;
}
#cdReport .table-bordered td:nth-child(5){
	direction:ltr;
}
#cdReport .table-bordered td:nth-child(6){
	direction:ltr;
}
#cdReport .table-bordered td:nth-child(7){
	direction:ltr;
}
.ui-draggable-handle{
	margin-bottom:10px;
}
.essentials-toggle-marker{
	padding-top:10px;
}
.side-barin .fa-list-alt{
	margin-right: 10px;
	margin-left: 0;
	float:left;
}
.table.table-simple.table-border-bottom tbody{
	background:#fff;
}
.table.table-simple.table-border-bottom tr{
	border-bottom: 1px solid #dee2e6;
}
.dataTables_wrapper .dataTables_filter input, select {
    border: 1px solid #dee2e6!important;
    padding: 5px;
}
.sys_alerts .dataTables_wrapper .dataTables_filter input, select{
    padding: 8px 8px 8px 7px;
}
.dataTables_length{
	float:left;
    position: relative;
}

.rtl .dataTables_length{
	float:left;
    position: relative;
    left: 40%;
}
.rtl #cdReport .dataTables_length{
    left: 0!important;
}

.custombox-modal .dataTables_length{
    left: 27%;
}
.dataTables_filter{
	float:left;
	margin-left:100px;
}
#OperatorPanel .dataTables_filter{
	float:left;
	margin-left:80px;
}
#RepresentativesPanels .dataTables_filter{
	float:right;
	margin-left:80px;
}
#RepresentativesPanels .dt-buttons.btn-group{
	left: 12px;
    position: absolute;
}
.side-barin {
    -moz-transition: all 200ms ease-out;
    -webkit-transition: all 200ms ease-out;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0px 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0px 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);
    height: 100%;
    transition: all 200ms ease-out;
    width: 240px;
	display: inline-block;
    width: 240px;
    z-index: 1;
    min-height: 100%;
    background: #FFFFFF;
    border-right: 1px solid #DDDDDD;
	margin-left:-220px;
	position:relative;
}
.side-barin h4{
	text-align:left;
	padding-left:15px;
}
.notification-list span{
	
}
.right-barin {
    background: #ffffff !important;
    z-index: 9999 !important;
	float: left;
	margin-top: 127px;
	min-height:780px;
	position: fixed;
    left: 0;
}

.right-barin h4 {
    border-bottom: 1px solid rgba(152, 166, 173, 0.5);
    padding: 4px 10px 10px 18px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.03em;
    margin-bottom: 0;
}
.right-barin .right-bar-toggle {
    float: left;
    line-height: 46px;
    font-size: 20px;
    color: #333;
    padding: 0 10px;
}
.dclose{
	cursor:pointer;
}
.drefresh{
	cursor:pointer;
}
.dfilter{
	cursor:pointer;
}
#dragdropreports .content{
	width: 100%;
}
#dragdropreports .container-fluid{
	padding:0;
}
#dragdropreports .container{
	padding:0;
	padding-left:20px;
}
.grid-stack>.grid-stack-item>.grid-stack-item-content{
	overflow:hidden!important;
}
.grid-stack-item-inside-content{
	margin:0;position:absolute;top:40px;left:10px;right:10px;bottom:30px;width:auto;overflow-x:hidden;overflow-y:auto
}
.grid-stack-item-content span{
	display:none;
}
.panel-footer {
    width: 100%;
    height: 30px;
    background: #F7F7F7;
    font-size: 14px;
	border-color: #eff2f7;
    background: #fff;
    color: #767676;
    width: 90%;
    padding-top: 5px;
	position:absolute;
	left:10px;
	right:10px;
	bottom:0;
	width:auto;
	padding-right: 15px;
}
.hide{
	display:none!important;
}
.call_counter{
    height: 50px;
}
.modal-backdrop {
    z-index: 0!important;
    background-color: #2125278c;
}
.dropdown-items {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}
.profile-dropdown{
	min-height:393px;
}
.kanban-box .btnposition {
    position: absolute;
    top: 45px;
    left: 20px;
}
.kanban-box .btntypeposition {
    position: absolute;
    top: 45px;
    left: 75px;
}
.user-page #topnav{
	min-height:auto!important;
}
.user-page .logo-large{
	width:32px;
}
.user-page .rounded-circle{
	width:21px;
	height:21px;
}
.user-page .logo.header-user {
    top: 0px;
    left: 10px;
}
.user-page .content{
	margin-top:55px!important;
}
.user-break{
	position: relative;
	right: 215px;
    top: -30px;
	float: right;
}
.taskboard-box ul.task-list {
	min-height:auto;
    margin-bottom: 0;
}
.dropdown.notification-list.open .dropdown-menu.dropdown-menu-right-flags{
	min-width: 160px;
}
.rtl .dropdown.notification-list.open .dropdown-menu.dropdown-menu-right-flags{
	left:-40px!important;
	min-width: 160px;
}
.opens .profile-dropdown{
	display:block;
}

.rtl .dropdown-items {
    text-align: right!important;
}
.grid-pannel{
	min-height:auto!important;
	margin-bottom:20px;
}
.grid-stack {
	min-height:auto!important
}
.grid-pannel:last-child {
    margin-bottom:40px;
}
.grid-stack-item .card-body{
	padding:1rem
}
.grid-stack-item-content {
  color: #2c3e50;
  text-align: center;
  background-color: #fff;
}
.grid-stack-item-content > .panel-heading {
    border-color: #eff2f7;
    background: #fff;
    color: #767676;
}
.grid-stack-item-content > .panel-heading {
    padding: 14px 10px;
}
.grid-stack-item-content>.panel-heading {
    border-color: #eff2f7;
    background: #fff;
    color: #767676;
}
.panel-footer {
    border-color: #eff2f7;
    background: #fff;
    color: #767676;
}
.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 13px;
    color: inherit;
	line-height:3px;
}
.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.panel-heading > .panel-title {
    height: auto;
    font-size: 13px;
    font-weight: bold;
}

.panel .actions {
    position: absolute;
    right: 30px;
    top: 8px;
}
.reportdate {
    cursor: pointer;
}
.panel-default .actions i {
    color: #909aa0;
    margin: 0 3px;
}
.panel .actions i {
    font-size: 0.875em;
    margin: 0 3px;
}
.flex {
    flex: 1 1 0%!important;
}
.loginform{
	margin-top: 140px;
    padding: 140px 40%;
    background: #fff;
	position:relative;
}
.plan-stats .form-control{
    width: 90%;
	direction: ltr;
	text-align: right;
}
.client .form-control {
    height: 32px !important;
}
.client .lbl {
    margin-top: 10px;
}
.client .checkbox label::before{
	top: 1px;
}
.table-dashboard-wrap {
    position: relative;
}
.lblbutton{
	top: 8px;
    position: relative;
}
#loading-spinner {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none; /* Initially hide the loader */
    text-align: center;
    background-color: rgba(255, 255, 255, 0.8); /* Add a semi-transparent background */
    padding: 20px;
    border-radius: 5px;
}

.loading-spinner {
    top: 65%!important;
}
.bt_buttons{
    position: relative;
    width: 100%;
    float: right;
}
    
#inputs input{
	display: block;
	width: 100%;
	height: calc(2.25rem + 2px);
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color:#495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.loginform .btn-primary{
	width: 220px;
    margin: 0 15%;
}
.control-label{
	display:none;
}
#keepLogin {
  width: 0px;
  height: 0px;
  cursor: pointer;
  vertical-align: bottom;
  color: black;
  background-color: rgba(0, 0, 0, 0.08);
}
.loginframe{
	position:relative;
}
.coverlink{
	width: 43px;
    height: 15px;
    border-bottom: solid 1px #111;
    background: #3e3e3e;
    background: -moz-linear-gradient(top, #3e3e3e 0%, #222222 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3e3e3e), color-stop(100%,#222222));
    background: -webkit-linear-gradient(top, #3e3e3e 0%,#222222 100%);
    background: -o-linear-gradient(top, #3e3e3e 0%,#222222 100%);
    background: -ms-linear-gradient(top, #3e3e3e 0%,#222222 100%);
    background: linear-gradient(to bottom, #3e3e3e 0%,#222222 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#3e3e3e', endColorstr='#222222',GradientType=0 )";
    position: absolute;
    top: -11px;
    left: 111px;
}
#addreport{
	padding:12px;
}
.no-padding{
	padding:0!important;
}
.bootgrid-header{
	padding-top:30px;
}
.search{
	float:right;
}
.actions.btn-group{
	float:left;
}
.width-150{
	width:150px;
}
#gtimes .btn-group{
	position: relative;
	width: 90%;
}

#gtimes .add-timeg{
	position: absolute;
    top: 8px;
	left: -20px;
}
.contentincon .text-editor{
	text-align: left;
	height: 900px!important;
	padding: 20px;
	direction: ltr;
	font-size: 15px;
}
#customname{
	width: 100%;
	display: block;
    text-align: left;
}
.pplace{
	position: absolute;
	left: 20px;
	font-size: 19px!important;
}
#compareModal .close_design{
	left: 27px;
}
#pbxModal .modal-dialog{
	max-width: 1000px;
}
#pbxModal .close_design{
	left: 27px;
}
#pbxModal .btn{
	padding: 0 7px;
	margin-right: 10px;
	height: 38px;
    width: 50px
}
.selectos{
	width: 100%!important;
}

.punchclock .btn-group, .btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    z-index: auto;
    left: -8.8%;
}

.rtl #cdReport .btn-group, .btn-group-vertical {
    left: auto;
}

.pagination>li:first-child>a, .pagination>li:first-child>span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover {
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}
.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}
.pagination>li {
    display: inline;
}
.disabled {
    display: none!important;
}
.w-90{
    width: 90%;
	height: 34px;
    margin-top: -10px;
}
.switch-container{
	float: left;
}
.btns{
	border-radius: 2px;
    padding: 7px 14px;
    font-size: 14px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-label-right {
    margin: -0.45rem -0.9rem -0.45rem 0.9rem;
    padding: 0rem 0.5rem;
    background-color: rgba(50,58,70,.1);
    display: inline-block;
	float: right;
}
.btnchart{
	border-radius: 2px;
    padding: 7px 14px;
    font-size: 14px;
	min-width: 9rem;
    text-align: center;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
#notes-modal .modal-dialog-notes{
	margin-top:20%;
}
.col-lg-15{
   flex: 0 0 12.166666667%!important;
   width: 12.166666667%!important;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.left {
    left: -37px;
}
div.hopscotch-bubble .hopscotch-bubble-arrow-container.left .hopscotch-bubble-arrow {
    border: none;
}

#secnav{
    min-height: 450px;
    overflow-y:auto;
    overflow-x: hidden;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
    border: none !important;
	position: relative;
	margin: -4px 10px 0 10px;
    padding-top: 11px;
}
.dragdrop-div{
    border: 1px dashed grey;
    border-radius: 5px;
    padding: 8px 0 8px 0;
    max-height: 40px;
	text-align: center;
}
.ivrdragdrop-div{
    border: 1px dashed grey!important;
    background-color: rgba(53, 184, 224, 0.15) !important;
    color: #35b8e0 !important;
}
.ivrdragedit .dragdrop-div{
    border-left: none;
    min-width: 250px;
}

.ivrdragedit{
    width: 230px;
}
#removeRow{
    max-height: 40px;
    z-index: 9999;
}
.w-40{
    width: 40%;
}
.w-50{
    width: 50%;
}
.addrows{
    
}
#list-IvrsContent{
    min-height: 230px;
}
.addrowslines{
    border-top: solid 1px black;
    padding-right: 15px;
    margin-bottom: 30px;
}
.ivrKeysButtons{
    height: 40px;
}
.miniPBX .input-group-append {
    margin-right: -2px;
}
.m-inputs{
    margin-left: 10px!important;
    height: 40px!important;
}
.drop-div{
    padding: 9px 15px;
    position: relative;
}
.table-responsive{
    position: relative;
    padding-top: 20px;
}
#paidsum{
    display: contents;
}
#paidsuminc{
    display: contents;
}
#paidsumcheck{
    display: contents;
}
#paidsumcheckinc{
    display: contents;
}
.col-md-125{
	width:14%;
	text-align:center;
	padding:5px;
}
.col-md-0{
	width:8%;
	text-align:center;
}
.nfwidth{
    width: 98%;
    margin-bottom: 10%;
}

.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover {
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd;
}
.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
	cursor:pointer;
}
.center-item{margin-left:auto!important; margin-right:auto!important;}
#nav-gray ul{margin-top:20px;}
#nav-gray ul>li{float:right;list-style: none; margin-left: 20px;}
.bgcolor {}
.agentmanage h2{color:#0077b5;font-size:16px;font-weight:700;}
.toptitle{padding:0 20px 20px 20px;}
.page__heading h1{margin-top:-10px;padding-right: 15px;font-size: 2em;}
.home-slider, 
.home-fader,
.single-item,
.quote-slider,
.home-round-slider,
.text-slider,
.expanding-slider,
.staff-slider,
.coverflow-slider,
.coverflow-thumbnails,
.store-thumbnails,
.category-slider,
.coverpage-classic,
.coverpage-cube,
.homepage-cover-slider,
.call-to-action-slider,
.pricing-table-slider{
    overflow:hidden;
}
.sender_logo img{
    height: 1.5rem;
    width: 1.5rem;
}
.flex {
    flex: 1 1 0%!important;
}
.txtcenter {
    text-align: center;
	line-height: 13px;
}
.alerticons{
        float: left;
}
.col-md-2 small {
    font-size: 80%;
    display: block;
    line-height: 6px;
	margin-top: 4px;
}
.col-md-1 small {
    font-size: 80%;
    display: block;
    line-height: 6px;
	margin-top: 4px;
}
.col-md-125 small {
    font-size: 80%;
    display: block;
    line-height: 6px;
	margin-top: 4px;
}
.center-item{margin-left:auto!important; margin-right:auto!important;}
#nav-gray ul{margin-top:20px;}
#nav-gray ul>li{float:right;list-style: none; margin-left: 20px;}
.bgcolor {}
.agentmanage h2{color:#0077b5;font-size:21px;font-weight:700;}
.toptitle{padding:0 20px 20px 20px;}
.page__heading h1{margin-top:-10px;padding-right: 15px;font-size: 2em;}
.breadcrumb {
    padding: 8px 15px;
    margin-bottom: -21px;
    list-style: none;
    background-color: #f5f5f5;
    border-radius: 4px;
}
.queue{
    float: right;
    width: 100%;
    text-align: right;
    margin-bottom: 20px;
}
.queue a{
    float: right;
}
.queue a.active{
    background:#4CAF50!important;
	border-color: #4CAF50!important;
	color:#fff;
}
.disblock{display:block;}
.fleft{float:left;}
.fleftim{float:left!important;}
.fright{float:right;}
#add_button{margin: 0 0 0 8px;}
#add_button2{margin: 0 4px 0 0}
#delete_data{margin: 0 0 0 8px!important}
#switchboard_upload{margin: 0 0 0 8px!important}
.btn-info {
    color: #fff;
    background-color: #0077B5;
    border-color: #0077B5;
    box-shadow: inset 0 1px 0 hsla(0,0%,100%,.15), 0 1px 1px rgba(0,0,0,.075);
}
.btn-info:hover{background-color:#fff;border-color:#0077B5;color:#0077B5;}
.fa {
    width: 16px;
    text-align: center;
    margin-left: 4px;
	float: right;
    line-height: 20px;
}
#nav-gray{clear:both;padding-right: 45px;}
.md-center{text-align:center;}
.md-center input{width: 106%;text-align: center;}
#tpsundaystart{display:none;}
#tpsundayend{display:none;}
#tpmondaystart{display:none;}
#tpmondayend{display:none;}
#tptuesdaystart{display:none;}
#tptuesdayend{display:none;}
#tpwednesdaystart{display:none;}
#tpwednesdayend{display:none;}
#tpthursdaystart{display:none;}
#tpthursdayend{display:none;}
#tpfridaystart{display:none;}
#tpfridayend{display:none;}
#tpsaturdaystart{display:none;}
#tpsaturdayend{display:none;}
.addhours{color:#0077b5;cursor:pointer;display:none;}
.saveagentimes{margin-top:30px;}
.switch {
  position: relative;
  display: inline-block;
  width: 47px;
  height: 23px;
}

.hours-form-container{
	padding:20px;
	clear: both;
}
.display-none{
	display:none;
}

.agents-table{
	float: right;
	padding:20px;
	width:100%;
}
.agents-table-head .col-md-2 label{
	text-align:center;
	width: 100%;
}
.agents-table-head{
	height:auto;
	padding:20px 20px;
	box-shadow: rgb(232, 232, 232) 0px -1px 0px 0px inset;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 50px;
    position: relative;
    background-color: rgb(0, 119, 181);
	color:#fff;
}
.hours-row label{
	margin-bottom:0;
}
	
.hours-form h2 {
    color: #141415;
    font-size: 1.6em;
    font-weight: 400;
    margin-bottom: 30px;
}
.hours-row{
	height:auto;
	padding:10px 20px 10px 20px;
	box-shadow: rgb(232, 232, 232) 0px -1px 0px 0px inset;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: auto;
    position: relative;
    background-color: rgb(255, 255, 255);
}
.hours-row:hover{
	background-color:#cccccc59;
	color:#141414;
}
.adddiv{margin-top:10px;}
.adddiv {
    margin-top: 10px;
    height: 36px;
    box-shadow: rgb(232, 232, 232) 0px -1px 0px 0px inset;
}
.adddiv:last-child {
    box-shadow: none;
}
.round-x{
	width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1px solid #4288c1;
    background: #4288c1;
    line-height: 7px;
    padding: 3px;
    color: #fff;
    cursor: pointer;
}
.displaynone {
	display:none;
}
.printtable{
	float:left;
	margin-bottom:10px;
}
.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: 15px;
  width: 15px;
  left: 3px;
  bottom: 3.5px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.width25per{
    width: 25%!important;
}
input:checked + .slider {
  background-color: #0077b5;
}

input:focus + .slider {
  box-shadow: 0 0 1px #0077b5;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
.modal-table td{
	padding-left:20px;
}
.modal-table td:last-child{
	padding-left:0px;
}
.form-control:focus{
	border: 1px solid #167ccb;
}

#dragdropreports .select2-selection{
	padding:3px 0;
}
.wellcome-title{
	font-size:18px;
}
.trash{
	position: absolute;
    bottom: 0;
	height:200px;
	display:flex;
	left: 9px;
}
.infos{
	margin-bottom:20px;
}
/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
.input-group-addon {
    background-color: #FFFFFF;
    border: 1px solid #E3E3E3;
    border-radius: 4px;
}
.form-control, .input-group-addon, .tagsinput, .navbar, .navbar .alert {
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.input-group-addon {
    position: absolute;
    left: 10px;
    top: 11px;
    z-index: 9;
    border: none;
    font-size: 20px;
    color: #435966;
    border-width: 0;
}

.title-row{
	height: auto;
    padding: 20px 20px 10px 20px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: auto;
    position: relative;
	background-color: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px;
    display: flex;
    margin-bottom: 4px;
    z-index: 301;
}
.disnone{display:none;}
.ldirection{direction:ltr;clear:both;}
.fade:not(.show) {
    opacity: 1!important;
}
#productModalClinets .modal-dialog{
    margin: 11.75rem auto;
}
#productModal .modal-dialog{
    margin: 11.75rem auto;
}
.modal-dialog .close {
    position: absolute;
    top: 33px;
    font-size: 28px;
    left: -28px;
    color: #eeeeee;
}
#customs-modal .modal-dialog .close {
    position: absolute;
    top: 33px;
    font-size: 28px;
    left: 40px;
    color: #eeeeee;
}
#addstock_form .select2-container--default .select2-selection--multiple{
	height: auto;
	width: 95%;
}
.select2-dropdown.select2-dropdown--above{
	width: 95%;
}
.modal-dialog span{
	cursor:pointer;
}
.modal-dialog{
	pointer-events: auto;
    z-index: 2;
}
.paidselect{
	position:absolute;
	top:451px;
	left:15%;
	z-index: 1;
}
.isfreeselect{
	position:absolute;
	top: 237px;
	width: 850px;
	left:13%;
	z-index: 1;
}
.isconnected{
    
}
.form-check-inline-sec{
	margin-top: 25px;
	margin-right: 0;
}
.form-check-inline-sec input[type="checkbox"]:checked + label::after{
	margin-top: 2px
}
.paidsum{
	position:absolute;
	top: 404px;
	left:24%;
    width: auto;
    padding: 15px;
	font-size: 20px;
	z-index: 1;
}
.paidsumcheck{
	position:absolute;
	top: 404px;
	left:50%;
    width: auto;
    padding: 15px;
	font-size: 20px;
	z-index: 1;
}
.contents{
    display: block;
}
.sepciallinks{
    margin: 5px 10px;
    top: 6px;
    position: relative;
}
.selects{
	border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
	height:36px;
	width:100px;
    margin-left: 20px;
}
.licenses .pagination{
	float:left;
}
.col-search-input{
	top:10px;
}
#theadsearch th{
	background:#fff;
}
#CompareNumbers .modal-body{
	overflow: auto;
    max-height: 500px;
}
#CompareNumbers .modal-body::-webkit-scrollbar {
    width: 2px; /* Set scrollbar width */
}

/* Style the scrollbar thumb (the part that is draggable) */
#CompareNumbers .modal-body::-webkit-scrollbar-thumb {
    background-color: #188ae2; /* Set thumb color */
    border-radius: 10px; /* Optional: round the edges of the thumb */
}

/* Style the scrollbar track (the background of the scrollbar) */
#CompareNumbers .modal-body::-webkit-scrollbar-track {
    background: #188ae2; /* Set track color */
}

#CompareNumbers .datatable-filters {
    display: flex;
    align-items: center;
    gap: 15px; /* Space between checkboxes */
    margin-left: 20px; /* Add space to the left */
}

#CompareNumbers .dataTables_filter{
	display: flex;
    align-items: center;
}
#CompareNumbers .filter-checkbox:first-child {
	margin-right: 10px;
}
#CompareNumbers .form-check {
    display: flex;
    align-items: center; /* Ensures text is aligned with checkbox */
    gap: 7px; /* Adds space between checkbox and text */
}
#CompareNumbers .filter-checkboxes{
	display: inline;
}
#CompareNumbers .filter-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 5px; /* Space between checkbox and text */
    font-size: 14px;
    cursor: pointer;
    margin-left: 15px; /* Add space to the left */
	margin-bottom: 0!important;
}

#CompareNumbers .filter-checkbox input {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.rtl #wrapper_compare  .dataTables_length {
    float: left;
    position: relative;
    left: 1%;
}
#CompareNumbers .form-check-input {
	width: 18px;  /* Makes the checkbox bigger */
	height: 18px;
	border: 2px solid #007bff; /* Change border color */
	cursor: pointer;
	position: relative;
}

#CompareNumbers .form-check-input:checked {
	background-color: #007bff; /* Change check color */
	border-color: #007bff;
}
#CompareNumbers .form-check-label {
    margin-top: 1px;
	font-size: 15px;
}
.dataTables_filter,
.dataTables_length,
.dataTables_info,
.dataTables_paginate {
    position: relative;
    z-index: 100; /* Bring these controls to the front */
}

.dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10; /* Lower than the controls so they remain clickable */
}
#cdReport .dataTables_processing {
    top: 80%;
	transform: translate(-50%, -50%);
}
.inlinebuttons{
	display: -webkit-inline-box;
}

.main-content{
	width:100%;
}
.content{
	width: 98%;
    margin: 0 auto;
}
.mb-20{
	margin-bottom:20px;
}
.mb-70{
	margin-bottom:70px;
}
.mb-5{
	margin-bottom:8px!important;
}
.mr-20{
	margin-right:4%;
}
.pr-0{
	padding-right:0;
}
.color-sl{
	color:#EEAC48!important;
}
.color-queue{
	color:#518DFF!important;
}
.settings .card{
	margin-bottom:20px;
}
.settings .card-space{
	height:45px;
}
.settings .form-control{
	height:auto;
	text-align:right;
}
.activities .form-control{
	width: 85%;
    float: left;
}
#saveucategories{
    float: left;
}
#savenotifications{
    float: left;
}
#saveuserpass{
    float: left;
}
#savecolors{
    float: left;
}
#saveemail{
    float: left;
}
.settings .bg-light-info{
	width: 30px;
    height: 30px;
    margin-right: 5px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    border-radius: 100%;
	padding: 6px 1px 0 0;
}
.settings .card-options-collapse{
	padding-right: 6px;
}
.settings .feeds li span {
    float: none;
    width: auto;
    font-size: 12px;
}

.edit-profile .card{
	margin-bottom:20px;
}
.edit-profile .card-space{
	height:48px;
}
.edit-profile .form-control{
	height:auto;
	text-align:right;
}
.edit-profile .bg-light-info{
	width: 30px;
    height: 30px;
    margin-right: 5px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    border-radius: 100%;
	padding: 6px 1px 0 0;
}
.edit-profile .card-options-collapse{
	padding-right: 6px;
}
.edit-profile .feeds li span {
    float: none;
    width: auto;
    font-size: 12px;
}
.dataTables_scroll{
    display: block;
    width: 100%;
    overflow-x: auto;
    min-height: 300px;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.box-card {
    padding: 8px;
    border-radius: 5px;
    margin-bottom: 20px;
    background-color: #25628f;
	height: 110px;
	color: #fff;
}
.diplay-none{
    display: none!important;
}
.delrecord{
	left: 111px;
    bottom: 10px;
    position: relative;
}
.dropdown, .dropup {
    position: relative;
}
.float-right, .pull-right, .close {
    float: left !important;
}
.pull-right {
    float: right;
}

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}
.pull-right>.dropdown-menu {
    right: 0;
    left: auto;
}
.dropdown-menu-right {
    right: 0;
    left: auto;
}
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}
.profile-dropdown.dropdown-menu {
  display: none; /* default */
}

.profile-dropdown.dropdown-menu.show {
  display: block;
}

.border-solid .card-box {
    padding: 8px;
    border-radius: 5px;
    margin-bottom: 20px;
    background-color: #25628f;
    height: 110px;
    color: #fff;
}
.card-box .card-drop {
    color: #98a6ad;
    font-size: 20px;
    height: 20px;
    line-height: 1px;
    display: inline-block;
}
.dropdown-item:first-child {
    border-top-left-radius: calc(.25rem - 1px);
    border-top-right-radius: calc(.25rem - 1px);
}
.text-left, th, .table, .header-title, .header-title + p, .dropdown-item, .card-box, .select2-container--default .select2-results > .select2-results__options, .dropzone {
    text-align: center !important;
}

.dropdown-item {
    padding: 6px 1.5rem;
}
.dropdown-menu-right .dropdown-item {
    padding: 6px .4rem;
	text-align:left!important;
}
.rtl .dropdown-menu-right .dropdown-item {
    padding: 6px .4rem;
	text-align:right!important;
}
.rtl div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow {
    border-bottom: 17px solid transparent;
    border-left: 17px solid #fff!important;
    border-top: 17px solid transparent;
    position: relative;
    left: -7px;
    top: -34px;
}
.rtl div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow {
    border-left: 19px solid #188ae2;
    left: -5px;
}
.rtl div.hopscotch-bubble {
    border: 3px solid #188ae2;
    border-radius: 5px;
}
.rtl div.hopscotch-bubble .hopscotch-bubble-arrow-container.right .hopscotch-bubble-arrow-border {
    border-left: 19px solid #188ae2!important;
}
.rtl div.hopscotch-bubble .hopscotch-bubble-arrow-container.right {
    top: 10px;
    right: -22px;
}
.profile-dropdown .dropdown-item {
    text-align:right!important;
	line-height: 14px;
}
.border-solid .widget-chart-1 .widget-chart-box-1 {
    float: left;
    margin-top: -28px;
    width: 39%;
}
.widget-chart-1 .widget-chart-box-1 {
	width:33.3333%
}
.border-solid .text-muted {
    color: #98a6ad !important;
	text-align: right;
	font-size: 14px;
}
.border-solid .Clock{
	font-size:18px
}
.border-solid .queuetext{
	float:right;
}
.border-solid .ringstrategy{
	float:left;
	width: 50%!important;
	font-size: 18px!important;
}
.border-solid .widget-chart-1 .widget-detail-1 {
    text-align: left;
    margin-left: 3%;
    margin-right: 0;
    min-height: 77px;
    float: right;
    margin-top: -4px;
    width: 26%;
}
.border-solid .widget-detail-1 h2{
	text-align:right;
}
.border-solid .header-title {
	text-align: right!important;
    width: 62%;
    float: right;
}
.reports{
	position:absolute;
	z-index: 1000;
    margin-top: 15px;
    margin-right: 18px;
    width: 220px;
    padding: 10px 10px 0 10px;
}
.border-item {
  padding: .3rem;
  box-shadow: 0 15px 30px 0 rgba(0,0,0,0.11),
    0 5px 15px 0 rgba(0,0,0,0.08);
  background-color: #ffffff;
  border-radius: 0.5rem;
  
  border-left: 0 solid #25628f;
  border-right: 0 solid #25628f;
  transition: border-left 300ms ease-in-out, padding-left 300ms ease-in-out;
}

.border-item:hover {
  padding-left: 0.2rem;
  border-left: 0.2rem solid #25628f;
  padding-right: 0.2rem;
  border-right: 0.2rem solid #25628f;
}

.border-item > :first-child {
  margin-top: 0;
}

.border-item > :last-child {
  margin-bottom: 0;
}

#dragdropreports .dataTables_length{
	float:left;
}
#dragdropreports .canvasjs-chart-container{
	direction:ltr;
}
#trash span{
	color:#fff;
}
.drag-bottom{
	height:30px;
	background:#ccc;
}
.pt-20{
	padding-top:20px;
}

.pt-1{
	padding-top:1px!important;
}
.bg-green{
	background:#ebeff2;
	margin:25px 0;
}
.fa-external-link{
	color: #c5c9ca;
    position: absolute;
    left: 8px;
    top: 21px;
	cursor:pointer;
	font-size: 1.6em!important;
	z-index:1000;
}
 .GaugeMeter{
    Position:        Relative;
    Text-Align:      Center;
    Overflow:        Hidden;
    Cursor:          Default;
	width:100px!important;
  }

  .GaugeMeter SPAN,
  .GaugeMeter B{
    Margin:          0 0;
    Width:           100%;
    Position:        Absolute;
    Text-align:      Center;
    Display:         Inline-Block;
    Color:           RGBa(0,0,0,.8);
    Font-Weight:     100;
    Font-Family:     "Open Sans", Arial;
    Overflow:        Hidden;
    White-Space:     NoWrap;
    Text-Overflow:   Ellipsis;
	color: #fff!important;
  }
  .GaugeMeter[data-style="Semi"] B{
    Margin:          0 10%;
    Width:           80%;
  }

  .GaugeMeter S,
  .GaugeMeter U{
    Text-Decoration: None;
    Font-Size:       .5em;
    Opacity:         .5;
  }

  .GaugeMeter B{
    Color:           Black;
    Font-Weight:     300;
    Font-Size:       1em;
    Opacity:         .8;
  }
  .GaugeMeter-m{
	  margin-top: -2px!important;
  }
  .square-span{
	  margin-top:5px;
  }
  #icon-phone-new{
	  display:none;
  }

.thead-dark{
	width:100%;
	height: auto;
    padding: 12px 20px 10px 20px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: auto;
    position: relative;
    background-color: #25628F;
	color:#fff;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px;
    display: flex;
    margin-bottom: 4px;
    z-index: 301;
}
.thead-dark .col-md-2{
	max-width:14.4%!important;
}
.table-row .col-md-2{
	max-width:14.4%!important;
}

.table-row{
	background: #FFFFFF;
	width: 100%;
    height: 60px;
    padding: 20px 20px 10px 20px;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 10px;
	clear:both;
}
.table-row-wrap{
	cursor: pointer;
}
.fleft{
	float:left;
}
.text-center {
    font-size: 1.2em;
    color: #7d7d7d;
	font-family: 'Assistant', sans-serif;
}
.text-header{
	font-size: 1.2em;
    color: #fff;
	text-align:center;
	font-family: 'Assistant', sans-serif;
}
.report-data .MiniIllustration.MiniIllustration--largeAvatar{
	margin-right:10px;
}
.dropdown-item.report-data{
	line-height: 23px;
}
.row-wrap{
	width:100%;
}
.row-form{
	width:100%;
	height:auto;
	background:#fff;
	margin-bottom:5px;
	display:block;
}
.small, small{
	font-size:96%;
}
.square {
  border:1px solid #ccc;
  border-radius:4px;
  position: relative;
  padding:0;
  width: 50%;
}

.square:after {
  content: "";
  display: block;
  padding-bottom: 50%;
}
.square-content {
  position: absolute;
  text-align:center;
  padding:3px;
  width: 100%;
  height: 100%;
}
.square-content span{
  width: 100%;
  text-align:center;
  float:right;
}
.square-content span{
	color:#fff!important;
}
.height{
}
.ltr{
	direction:ltr;
}
.title
{
	font-family: 'Assistant', sans-serif;
}

.fa{
	margin-left:10px;

}
.border-solid span{
	font-size:12px;
	color:#2a2929;
	width: 100%;
	float: left;
    text-align: center;
	font-family: 'Assistant', sans-serif;
}
.title{
  padding-top:0;
  line-height: 16px;
}
.floatnon{
	float:none!important;
}
.textcolor{
	color: black;
}
#divx span{
	float:none!important;
}
#product_data .text-left:last-child{
	width:8%!important;
}
.value{
	border-radius:3px;
	text-align: center;
}
.col-md-12.border-solid.mb-20 span{
	
}
.border-solid .col-md-4{
	padding-left: 2px;
    padding-right: 2px;
}
.border-solid{
	background: #FFFFFF;
	width: 100%;
    padding: 12px 15px 10px 20px;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
	margin-bottom: 7px;
}
.green-row{
	background-color:#91E5AD;
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#000;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
	font-size:16px;
	font-weight:600;
}
.green-row span{
	color:#000;
	font-size:16px;
	font-weight:600;
}
.green-row small{
	color:#000;
	font-size:16px;
	font-weight:600;
}

.green-rows{
	/*background-color:#91E5AD;*/
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#000;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
	font-size:16px;
	font-weight:600;
    height: 44px;
    border: none;
}
.green-rows span{
	color:#000;
	font-size:16px;
	font-weight:600;
}
.green-rows small{
	color:#000;
	font-size:16px;
	font-weight:600;
}

@keyframes Ringblinks {
    0% {
		background: #91E5AD; /* idle green */
        box-shadow:0px 0px 0px 5px #91b2ff;
    } 
}
.blue-row{
	background: #477BF5;   ring blue
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#000;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    /*animation: Ringblinks 2.0s cubic-bezier(0.02, 1.18, 0, -1.24) infinite;*/
    z-index: 9999;
}
.blue-row span{
	color:#fff;
}

.blue-rows{
	/*background: #477BF5;   ring blue */
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#000;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    /*animation: Ringblinks 2.0s cubic-bezier(0.02, 1.18, 0, -1.24) infinite;*/
    z-index: 9999;
    height: 44px;
    border: none;
}
.blue-rows span{
	color:#fff;
}

.orange-row{
	background: #477BF5;   ring blue
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#fff;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    /*animation: Ringblinks 2.0s cubic-bezier(0.02, 1.18, 0, -1.24) infinite;*/
    z-index: 9999;
    
}
.orange-row span{
	color:#fff;
}

.orange-rows{
	/*background: #477BF5;   ring blue */
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#fff;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    /*animation: Ringblinks 2.0s cubic-bezier(0.02, 1.18, 0, -1.24) infinite;*/
    z-index: 9999;
    height: 44px;
    border: none;
}
.orange-rows span{
	color:#fff;
}

.grey-row{
	background-color:rgb(212,212,212);
	width: 100%;
    padding: 10.9px;
    -webkit-box-align: center;
    align-items: center;
	color:#fff;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
	font-size:16px;
	font-weight:600;
}
.grey-row span{
	color:#fff;
}

.grey-rows{
	/*background-color:rgb(212,212,212);*/
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#fff;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    height: 44px;
    border: none;
}
.grey-rows span{
	color:#fff;
}

.red-row{
	background-color:#F9D890;
	width: 100%;
    font-size: 12px;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#141414;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;

}
.red-row span{
	color:#141414;
    font-size: 12px;
}

.red-rows{
	/*background-color:#F9D890;*/
	width: 100%;
    font-size: 12px;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#141414;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    height: 44px;
    border: none;
}
.red-rows span{
	color:#141414;
    font-size: 12px;
}

.yellow-row{
	background-color:yellow;
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#fff;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    
}
.yellow-row span{
	color:#141414;
}

.yellow-rows{
	/*background-color:yellow;*/
	width: 100%;
    padding: 8px;
    -webkit-box-align: center;
    align-items: center;
	color:#fff;
    position: relative;
    box-shadow: 0px 4px 20px rgba(160, 188, 196, 0.2);
    margin-bottom: 5px;
    height: 44px;
    border: none;
}
.yellow-rows span{
	color:#141414;
}
.left-bar .mdi.mdi-deskphone{
	color:#141414!important;
}
.left-bar .mdi.mdi-phone-voip{
	color:#141414!important;
}
.left-bar .list-inline-item{
    margin-right: 10px;
    position: relative;
}
.topbar-right-menu .mdi.mdi-deskphone{
	color:#fff;
}
.topbar-right-menu .mdi.mdi-phone-voip{
	color:#fff!important;
    cursor: pointer;
}
.licenses .table-responsive{
    overflow: hidden;
}
.mdi.mdi-deskphone-color{
	color:#007bff;
}
.mdi .mdi-periodic-table{
	float: left;
}
.mt-5{
	margin-top:5px!important;
}
.mt-10{
	margin-top:10px!important;
}
.mt-20{
	margin-top:20px!important;
}
.mt-30{
	margin-top:30px!important;
}
.mt-150{
	margin-top:150px!important;
}
.mt-140{
	margin-top:150px!important;
}
.mt-100{
	margin-top:100px!important;
}
.mt-80{
	margin-top:80px!important;
}
.m-r-20{
  margin-left:20px!important;
}
.mr-10{
  margin-right:10px!important;
}
.m-l-50{
  margin-left:50px!important;
}
.rtl .m-l-20{
  margin-right:20px!important;
}
.rtl .m-r-20{
  margin-left:20px!important;
}
.mdi.mdi-star{
	float: left;
    margin-left: 4%;
    margin-top: 10px;
	color:#999;
	cursor:pointer;
}
.mdi.mdi-email-plus-outline {
    color: #25628F;
    font-size: 60px;
}
.switchbreak span{
	width:auto;
}
.switchbreak input:checked + .slider {
    background-color: #db0e0e;
}
.switchbreak .slider{
	background-color: #009900;
}
.switch.switchbreak{
	margin-top:10px;
}
#Call_Campaigns{
   margin-top: 90px;   
}
.hide-pannel{display:none;}
.testgrid tr:hover td{font-size:14px}
.testgrid tr:hover a{color:#141414!important}
.col-md-2.square.blue{background-color:rgb(55,123,255);color:white;text-align:center}
.col-md-2.square.green{background-color:rgb(149,221,30);color:white;text-align:center}
.col-md-2.square.grey{background-color:rgb(212,212,212);color:white;text-align:center}
.col-md-2.square.red{background-color:#F44336;color:white;text-align:center}
.col-md-2.square.yellow{background-color:#FFEB3B;color:white;text-align:center}
.col-md-2.square.yellow span{color:#141414;}
.col-md-2.square.yellow small{color:#141414;}
.col-md-2.square.grey span{color:black!important;}
.col-md-2.square.grey small{color:black!important;}
.grey-row .col-md-4.pr-0 span{color:black!important;}
.grey-row .col-md-4.pr-0 small{color:black!important;}

.col-md-2.square{color:red;}
.fa.fa-flag{color:rgb(149,221,30);}
.fa.fa-phone{color:rgb(55,123,255)}
.fa.fa-clock-o{color:rgb(55,123,255)}
.fa.fa-hourglass-end{color:rgb(55,123,255)}
.col-md-2.square {color: black;font-size: 14px;font-weight: 600; margin-top: 14px;}
.border-solid.s{background-color: #eeeaea; margin-bottom: 28px;margin-left:-5px;margin-top:-16px;width: 781px;}
.border-solid.s.status {
    position: relative;
    width: 652px;
    height: 166px;}
.border-solid.s.calls{ margin-top: 16px;}
.border-solid.s.agents{margin-top: -32px;}
.border-solid.s.agentstatus{margin-top: 16px;}
.border-solid.s.avaiable {
    position: relative;
    margin-right: 11px;
    margin-left: 9px;
    margin-top: 16px;
}
.custom_modal {
    display: none;
    position: fixed;
    z-index: 999;
    padding-top: 50px;
    padding-bottom: 50px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}
.modal-demo{
	width:100%!important;
	height:100%!important;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius:8px;
}
.custombox-modal-container{
	margin-top:50px!important;
}
.custom-modal-text {
    height: 690px;
}
#custom-modal{
	overflow:auto;
	max-height:780px;
}
#custom-modal .col-xl-12{
	float:none;
}
.custom-modal .custom-modal-title {
    padding: 20px 10px;
    line-height: 22px;
    font-size: 18px;
    background-color: #fff;
    color:#25628F;
    text-align: right;
    margin: 0px;
    width: 100%;
	border-bottom: 1px solid #e1e1e1;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}
.openmodal.dropdown-item{
	border-bottom: 1px solid #e1e5f0;
}
.openmodal.dropdown-item:hover{
	background:#4a59b4 !important;
	height:100%!important;
}
.dropdown-menu.dropdown-menu-right{
    box-shadow: 0 0 15px 6px #ccc;
}

.mdi.mdi-table-settings{
	color:#25628F;
	font-size:60px;
}
#speedometerWraper-speedometer{
	margin-top:130px;
	margin-bottom:30px;
}

.title.status{position: relative;
    left: 158px;}

.extname{
    font-size: 16px;
    font-weight: bold;
}
.col-md-2 span{
    font-size: 16px;
    font-weight: bold;
}
.col-md-6 samll{
    font-size: 16px;
    font-weight: bold;
}
.feeds {
    margin: 0px;
    padding: 0px;
}
.feeds li {
    list-style: none;
    padding: 10px;
    display: block;
}
.feeds li>div {
    width: 40px;
    height: 40px;
    margin-right: 5px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    border-radius: 100%;
}
.feeds li:hover {
    background: #ebf3f5;
}
html body .bg-light-info {
    background-color: #cfecfe;
}
html body .bg-light-success {
    background-color: #e8fdeb;
}
html body .bg-light-warning {
    background-color: #fff8ec;
}
html body .bg-light-danger {
    background-color: #f9e7eb;
}
html body .bg-light-inverse {
    background-color: #f6f6f6;
}
html body .bg-light-info {
    background-color: #cfecfe;
}
.feeds li>div i {
    line-height: 40px;
}
.feeds li span {
    float: left;
    width: auto;
    font-size: 12px;
}
.feeds .fa {
    margin-right: 12px;
    margin-top: 2px;
}
.text-bold{
    font-weight: bold;
}
[class^="ti-"], [class*=" ti-"] {
    font-family: 'themify';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
audio{
	height:25px;
/*	position: absolute; */
	margin-right: -14em;
	margin-left: -2em;
}
.div-table audio{
	height:25px;
/*	position: absolute; */
	margin-right:0;
	margin-left: 0;
    margin-top: 8px;
}
/* End New */


#INVtype{
    width: 100%;
    height: 30px;
}
#product_INVform input[type="text"] {
    height: 30px;
    border: 1px #ccc solid;
    border-radius: 3px;
    margin-left: 30px;
}
.content-reports {
     background-color: #fff!important;
     padding: 25px!important;
     margin-top: 20px!important;
  }
div.dataTables_wrapper div.dataTables_paginate{
    margin-bottom: 30px!important;
}

/* use for any tag on your page */
/*You can use [title] selector as well*/

#tooltip {
  color: #fff;
  background: #0056b3;
  position: absolute;
  z-index: 999999;
  padding: 15px;
  pointer-events: none;
}

#tooltip::after {  /* triangle decoration */
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #0056b3;
  content: '';
  position: absolute;
  left: 50%;
  bottom: -10px;
  margin-left: -10px;
}

#tooltip.top::after {
  border-top-color: transparent;
  border-bottom: 10px solid #0056b3;
  top: -20px;
  bottom: auto;
}

#tooltip.left::after {
  left: 10px;
  margin: 0;
}

#tooltip.right::after {
  right: 10px;
  left: auto;
  margin: 0;
}
.text-right{
	text-align: right!important;
}
.h-md{
    height: 38px;
    font-size: 18px;
    width: 15.5%;
    margin-right: 4px;
}
.mb-10{
    margin-bottom: 1rem!important;
}
.ivrKeyButtons{
    height: 40px;
}
.plan-stats li select{
   direction: ltr; 
}
#secnav .btn-info.active {
    color: #fff;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
#secnav .btn-info:hover {
    color: #fff;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
#secnav .btn-primary.active {
    color: #fff;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
#secnav .btn-primary:hover {
    color: #fff;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
#secnav .btn-green.active {
    color: #fff;
    background-color: #25628f!important;
    border-color: #25628f!important;
}
#secnav .btn-green:hover {
    color: #fff;
    background-color: #25628f!important;
    border-color: #25628f!important;
}

#list-tconditions .uitooltip {
    background:#5b69bc;
	width: 100px!important;
}
#queue_data_view span{
	font-size:2.5em;
	color:black;
	padding:8px 8% 8px 8%;
	max-width:100%;
	float:right;
	width:100%;
}
#queue_data_view td{
    padding-bottom: 0rem!important;
	padding-top: 0rem!important;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}
#queue_data_view th{
    padding-bottom: 0.9rem!important;
	padding-top: 0.9rem!important;
}
#queue_data_view_wrapper .dataTables_info{
	display:none;
}
#fax_content{
    direction: ltr;
}
#fax_subject{
    direction: ltr;
}
#notify_email{
    direction: ltr;
}

.switch-radio {
    float:right;
}
.switch-radio3 {
    float:right;
}
.switch-radio2 {
    float:right;
	margin: 0 15px;
}

.pl-10{
	padding-left:10px;
	margin-top: 0;
}
.pl-20{
	padding-left:20px;
	margin-top: 0;
}
.pr-10{
	padding-right:10px;
	margin-top: 0;
}


#call_direction1{
	height: 31px;
	margin-bottom: 6px !important;
}
.blnotes{
	height: 31px;
}
.blnumber{
	height: 31px;
}
/* The switch - the box around the slider */
#queue_data .switch {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 17px;
}

#queue_data .switchstatus {
  bottom: -7px;
}

/* Hide default HTML checkbox */
#queue_data .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
#queue_data .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #f3f3f3;
  -webkit-transition: .4s;
  transition: .4s;
}

#queue_data .slider:before {
  position: absolute;
  content: "";
  height: 13px;
  width: 13px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

#queue_data input:checked + .slider {
  background-color: #2196F3;
}

#queue_data input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

#queue_data input:checked + .slider:before {
  -webkit-transform: translateX(13px);
  -ms-transform: translateX(13px);
  transform: translateX(13px);
}

/* Rounded sliders */
#queue_data .slider.round {
  border-radius: 34px;
}

#queue_data .slider.round:before {
  border-radius: 50%;
}
.checkbox-wrapper{
	display:inline-flex;
}
.brown-color{
	color:#cbc5bf;
	font-size:30px;
}
.setting-user{
	width: 100%;
    height: 100px;
	text-align:center;
	font-size: 16px;
}
.setting-user span{
	float:none;
}
.setting-logout{
	width: 100%;
    height: 50px;
	text-align:center;
	font-size: 16px;
	margin-top: 227px;
}
.setting-user .ti-user{
	font-size:55px;
	color:#25628f;
}
.notify-item{
	width: 100%;
    height: 70%;
}
.width-100{
	width:100%!important;
	text-align:right;
}
#description{
    display: inline;
	margin-top: 1px;
}
.man-icon{
	margin-top:10px;
	margin-bottom:10px;
}
.man-icon img{
	width:75px;
	height:75px;
}
.dropdown-item.notify-item.man-icon:hover{
	background:transparent!important;
	z-index:-1000;
}
.border-bottom{
	border-bottom:solid 1px #CCCCCC;
    padding-top: 4px;
	padding-bottom: 4px;
	margin-bottom:0px;
}
.border-logout{
	border:solid 1px #CCCCCC;
	border-radius:39px;
	padding:8px 40px;;
	color:#16181b;
	
}
#records h4 {
  position: relative;
  justify-content: center; /* horizontally center */
  text-align: right;
  gap: 10px; /* optional spacing */
}
.dynamic-audio-player-wrapper{
	position: absolute;
	left:43%;
	top: -13px;
}
.fa-circle-play {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #fff;
  color: #f26d6d;
  font-size: 18px; /* Smaller font so the icon fits well inside */
  cursor: pointer;
  transition: background-color 0.3s;
  border: 1px solid #757575;
  position: relative;
  top: 2px;
}
#url_event{
	word-wrap: break-word;
    padding-left: 50px;
}
.fa-circle-play::before {
  display: inline-block;
}

.fa-circle-play:hover {
  background-color: #fff;
}
.btn-playrecording .fa-stop {
  color: #f26d6d;
  position: relative;
  font-size: 19px;
  width: 16px;
  height: 16px;
  line-height: 16px;
  top: 4px !important;
  border: 1px solid #757575;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}



.close_design {
    font-weight: bold;
    top: -30px;
    left: -40px;
    position: absolute;
    z-index: 9;
    background-color: #fff;
    font-size: 25px;
    padding: 3px 9px;
    border-radius: 50%;
    color: #6c757d;
    box-shadow: 0 0 4px 0 #ccc;
    line-height: 25px;
	opacity:1!important;
}

.close_design_cam {
    font-weight: bold;
    top: -16px;
    left: 218px;
    position: absolute;
    z-index: 9;
    background-color: #fff;
    font-size: 25px;
    padding: 3px 9px;
    border-radius: 50%;
    color: #6c757d;
    box-shadow: 0 0 4px 0 #ccc;
    line-height: 25px;
	opacity:1!important;
}

.close_design_newgroup {
    font-weight: bold;
    z-index: 9;
	float: left;
    background-color: #fff;
    font-size: 25px;
    padding: 3px 9px;
    border-radius: 50%;
    color: #6c757d;
	border-color: #6c757d;
    box-shadow: 0 0 4px 0 #ccc;
    line-height: 25px;
	opacity:1!important;
	cursor: pointer;
	position: absolute;
	left: 16px;
    top: 17px;
}
/* Button styling */
.btn-edit {
    background: transparent;
    border: none;
    margin-left: 5px;
    color: #4cae4c;
    cursor: pointer;
	float: left;
}
.btn-edit i.mdi-content-save-all {
	top: 3px;
    position: relative;
}
.btn-edit i {
	color: #fff;
	font-size: 16px;
}

.btn-edit {
    background: transparent;
    border: none;
    margin-left: 5px;
    color: #4cae4c;
    cursor: pointer;
	float: left;
}
.btn-edit i.mdi-content-save-all {
	top: 3px;
    position: relative;
}
.btn-edit i {
	color: #fff;
	font-size: 16px;
}

.btn-editrecord {
    background: transparent;
    border: none;
    margin-left: 5px;
    color: #4cae4c;
    cursor: pointer;
	float: left;
}
.btn-editrecord i.mdi-content-save-all {
	top: 3px;
    position: relative;
}
.btn-editrecord i {
	color: #fff;
	font-size: 16px;
}


.v-button {
    background: transparent;
    border: none;
    margin-left: 5px;
    color: #4cae4c;
    cursor: pointer;
	float: right;
}
.v-button i.mdi-content-save-all {
	top: 3px;
    position: relative;
}
.v-button i {
	color: #fff;
	font-size: 16px;
}

.rv-button {
    background: transparent;
    border: none;
    margin-left: 5px;
    color: #4cae4c;
    cursor: pointer;
	float: right;
}
.rv-button i.mdi-content-save-all {
	top: 3px;
    position: relative;
}
.rv-button i {
	color: #fff;
	font-size: 16px;
}

.close {
	opacity:1!important;
}
.profile-design{
	float: right;
    border: 1px solid #ccc;
    margin: 0 6%;
    text-align: center;
    padding: 4px;
    border-radius: 9px;
    width: 72px;
    height: 72px;
	margin-top: 120px;
    margin-bottom: 35px;
}
.profile-design:nth-child(1) {
  background: #5b69bc;
}
.profile-design:nth-child(2) {
  background: #dc3545;
}
.accountTable td{
    padding: 0 0 0 10px;
    text-align: right;
}
.notify-item span{
	width:100%;
	line-height:13px;
}
.profile-div{
	margin:0 13%;
}
.notify-item .ti-settings{
	font-size:30px;
}
.notify-item .ti-lock{
	font-size:30px;
    display: flow-root;
}

.PortfolioIndex-inner {
    width: 840px;
    margin: 0 auto;
}
.card-reports .card-box{
	background:#4178bc;
	margin-bottom:3px;
}
#OPcubes .card-reports .mdi{
	font-size: 3rem;
}
.card-reports .mdi{
	color:#fff;
}
.card-reports .mdi-chart-donut-variant{
	font-size:3rem;
}

.card-reports .mdi-format-line-style{
	font-size:3rem;
}
.card-reports .mdi-dots-vertical{
	margin-right:10px;
	font-size:2rem!important;
}
.card-reports .pull-right{
	position: absolute;
    top: 20px;
    left: 7px;
}
.openmodal.dropdown-item .mdi{
	font-size:1.2rem;
	color:#4178bc;
	padding-right: 0.4rem;
}

.rtl .openmodal.dropdown-item .mdi{
	padding-left: 0.4rem;
}
.report-data:hover .mdi{
	color:#fff;
	padding-right: 0.4rem;
}
.rtl .report-data:hover .mdi{
	padding-left: 0.4rem;
}
.dropdown-menu.dropdown-menu-right{
	min-width: 260px!important;
}
.report-title-name {
    box-sizing: border-box;
    margin-top: 8px;
    padding: 0 8px;
    -webkit-box-orient: vertical;
    color: var(--color-text);
    display: -webkit-box;
    font-size: 14px;
    font-weight: 500;
    -webkit-line-clamp: 2;
    line-height: 18px;
    max-height: 36px;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    width: 100%;
}
.tab-content #employee-grid input[type="text"]{
    margin-left: 0;
}
.update_form, .update_form1{
    width: 90%;
    margin-top: 3px;
    padding: 2px!important;
}
.callsprice{
    margin-left: 0!important;
    margin-right: 0!important;
}
#svg-animation{
	direction:ltr;
}
#animating-donut{
	direction:ltr;
}
#animating-area{
	direction:ltr;
}
#smil-animations{
	direction:ltr;
}
.card-reports{
    width: 900px;
	margin:0 auto;
}

.iconsize{
    float: left;
    font-size: 15px;
    position: relative;
    height: 10px;
    color: #2d07a3;
}

.iconsize:before{
    float: left;
    font-size: 20px;
    position: absolute;
    left: 15px;
    top: -9px;
}

.iconrecord{
    float: left;
    font-size: 15px;
    position: relative;
    height: 10px;
    left: 6px;
}

.iconrecord:before{
    float: left;
    font-size: 25px;
    position: absolute;
    top: -13px;
    color: #141414;
}

.btn-grey .iconrecord:before{
    color: #fff;
 }
.btn-warning .iconrecord:before{
    color: #fff;
}
.acolor{
    color: #fff;
}
.acolor:hover{
    color: #fff;
}
.ChartDialogDetailsChartDetailsSection-chartTypes {
    display: flex;
    justify-content: space-between;
    overflow-wrap: break-word;
	margin-bottom:6px;
}
.ChartDialogDetailsChartDetailsSection-chartItem {
    width: 62px;
	float: right;
	margin-left:10px;
}
.BaseSelectableCard--isEnabled.active.BaseCard.BaseCard--isValid {
    border-color: #06F;
}
.Typography--m.Typography {
    font-size: 13px;
    line-height: 18px;
}
.Typography--textAlignCenter {
    text-align: center;
}
.Typography {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif;
}
.CustomRadioButton-radio {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
}
.ChartDialogDetailsChartDetailsSection-chartIcon {
    padding: 12px;
}
.BaseSelectableCard.BaseSelectableCard--isEnabled {
    cursor: pointer;
}

.ChartDialogDetailsChartDetailsSection-chartCard {
    display: block;
    margin-bottom: 8px;
}
.BaseSelectableCard {
    outline: none;
}
.BaseCard {
    background: var(--color-card-background);
    border: 1px solid #CCC;
    border-radius: 8px;
    box-shadow: none;
    transition-duration: 200ms;
    transition-property: background,border-color,box-shadow;
}
.ChartDialogDetailsChartDetailsSection-chartTypes {
    display: inline-block;
    justify-content: space-between;
    overflow-wrap: break-word;
}
.container-fluid-reports .card-box {
    padding: 20px;
    webkit-box-shadow: 0 0px 8px 0 rgb(0 0 0 / 10%), 0 4px 0px 0 rgb(0 0 0 / 7%);
    box-shadow: 0 0px 8px 0 rgb(0 0 0 / 10%), 0 4px 0px 0 rgb(0 0 0 / 7%);
    border-radius: 5px;
    margin-bottom: 20px;
    background-color: #ffffff;
	margin-top:20px;
	min-height:520px
}
.container-fluid-reports{
	max-height: 555px;
}
.hide-section{
	display:none;
}
.show-section{
	display:block!important;
}
#table-view{
	width:100%;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 3; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal-dialog-notes {
    margin-top: 20%;
}
/* Modal Content/Box */
.myreports .modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

.modal-contents{
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 0;
  border: 1px solid #888;
}

#notification .modal-contents {
  margin: 35% auto; /* 35% from the top and centered */
}
.width-46{
    padding: 0 5px;
}
.swal2-modal{
    z-index: 999999999;
}
.modal-contents{
    padding: 0;
}
.modal-body-counter{
    text-align: center;
    font-size: 16px;
    color: brown;
}
.body-modal{
    padding: 20px!important;
}
.modal-backdrop.fade.in{
	z-index: 9999;
}
.showcampaign-modal.fade.in {
    z-index: 1;
}
.select2-container--open {
  z-index: 9999999;
}
#showcampaign-modal .modal-content {
    max-width: 90%!important;
    margin: 0 auto;
}
#showcampaign-modal .modal-dialog .close {
    left: 43px;
}
#customs-modal .modal-content {
	margin: 7% auto;
}
#productModal .close_design{
  top: -12px;
  left: 29px;
}
#notes-modal .close_design{
  top: -33px;
  left: 27px;
}
#stocknameslistmodal .close_design{
  top: -33px;
  left: 27px;
}
.green_callstatus{
    background: green;
    color: white;
}
.red_callstatus{
    background: red;
    color: white;
}
.orange_callstatus{
    background: orange;
    color: white;
}
.grey_callstatus{
    background: grey;
    color: white;
}
.brown_callstatus{
    background: brown;
    color: white;
}
.resp-table-row{background-color: #fff;}
.resp-table-row:hover{background-color: #1979c3;color: #fff;}
.resp-table-row.even{
    background-color: #f2f2f2;
}

.resp-table-row.even:hover{
    background-color: #1979c3;
    color: #fff;
}

@media (min-width: 576px){
#showcampaign-modal .modal-dialog {
    margin: 12.75rem auto;
}
.k-diagram{
     width: 100%!important;
     height: 100%!important;
     float: left;
}
.k-layer{
     width: 100%!important;
     height: 600px!important;
     float: left;    
}
#diagram {
  width: 100%!important; /* Adjust as needed */
  height: 600px!important; /* Adjust as needed */
  position: relative!important;
  overflow: hidden!important;
}
#diagram g{
    margin: 0 auto;
    width: 100%;
    height: 100%;
}
/* Ticker Cell Styling */
.ticker-cell {
    width: 150px; /* Set a fixed width for the column */
    overflow: hidden;
    position: relative;
}

/* Ticker Wrapper */
.ticker-wrapper {
    display: inline-block;
    white-space: nowrap;
    position: absolute;
    animation: scroll 10s linear infinite;
}

/* Ticker Animation */
@keyframes scroll {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Optional Styling */
.ticker-text {
    display: inline-block;
    padding: 0 10px;
    color: #333;
    font-size: 14px;
}


/* Style for the diagram content */
.k-layer[data-role="surface"] {
  /* Adjust as needed */
}

/* Style for the horizontal scrollbar */
.km-horizontal-scrollbar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #f0f0f0; /* Adjust as needed */
  opacity: 1; /* Make sure it's visible */
}

/* Style for the vertical scrollbar */
.km-vertical-scrollbar {
  position: absolute;
  top: 0;
  right: 0;
  width: 10px;
  height: 100%;
  background-color: #f0f0f0; /* Adjust as needed */
  opacity: 1; /* Make sure it's visible */
}
#flowchart-modal .modal-dialog {
    margin: 12.75rem auto;
}
#flowchart-modal.modal-demo{
    width: 90%!important;
    height: 80%!important;
    margin: 10% 5%;
    overflow: hidden;
 }
#flowchart-modal  .custom-modal-title{
     border: none;
     color: #25628F;
 }
#flowchart-modal .modal-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
#flowchart-modal .modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#flowchart-modal .modal-content h4 {
    text-align: right;
    width: 100%;
    padding: 0 15px;
}
#flowchart-modal.modal{
   background-color: transparent!important;     
}
.btn-playrecording{
	left: -32px;
}
.btnrec{
	position: relative!important;		
}


/* Optional: Make all icons inside buttons consistent */
label .btn .icon {
  position: relative;
  top: 1px;  /* Adjust up/down to perfectly align */
}
.btn-playrecording {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px; /* Optional spacing between icon and text */
  cursor: pointer;
}


/* Optional: specific fix for play icon if still misaligned */
.btn-playrecording .fa-play {
  top: 1px;
}

/* Optional: stop icon (if used) */
.btn-playrecording.playing .fa-stop {
  top: 1px;
}
.waiting-boxes {
    padding: 15px;
    border-radius: 15px;
    margin-top: 10px;
}

/* Neutralize table for transparency */
.queue-summary-table {
    width: 100%;
    border-collapse: collapse;
    background-color: transparent;
	direction: rtl;
}

.queue-summary-table th,
.queue-summary-table td {
    padding: 10px;
    text-align: center!important;
    color: #fff!important; /* default white font */
	border-bottom: 1px solid rgba(255, 255, 255, 0.4)!important;
}

/* Optional: bold headers */
.queue-summary-table th {

	font-weight: bold;
	text-align: center!important;
	color: #fff!important;
	font-size: 1.1rem;
}
.queue-summary-table td {
	font-size: 1rem;
}
.waiting-time-table {
    width: 100%;
    border-collapse: collapse;
    background-color: transparent;
	direction: rtl;
}

.waiting-time-table th,
.waiting-time-table td {
    padding: 10px;
    text-align: center!important;
    color: #fff!important; /* default white font */
	border-bottom: 1px solid rgba(255, 255, 255, 0.4)!important; 
}

/* Optional: bold headers */
.waiting-time-table th {
	font-weight: bold;
	text-align: center!important;
	color: #fff!important;
	font-size: 1.1rem;
}
.waiting-time-table td {
	font-size: 1rem;
}
	
#add_notification .modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_notification{
	z-index: 9999;	
}
#customs-modal .modal-dialog {
    margin: 6.75rem auto;
}
#customs-modal .modal-dialogs {
    margin: -2rem auto;
}    
#productModal .top{
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
}
#productModalDiffPayment .close_design{
  top: -12px;
  left: 29px;
}
#waiting-table .waiting-table-td{
	background: #188ae2;
}
#waiting-table .waiting-table-td span{
	color: #fff;
	font-size: 14px;
    font-weight: 700;
}
#waiting-table .waiting-row-td{
	padding: 5px 0;	
}
#waiting-table .waiting-row-td span{
	font-size: 14px;	
}
.massedit{
  /* ...existing styles */
  place-content: center;
  width: 17px;
  height: 17px;
  margin-left: 10px;
}
.massdelete{
  /* ...existing styles */
  place-content: center;
  width: 17px;
  height: 17px;
  margin-left: 10px;
}
.fmassedit{
  /* ...existing styles */
  place-content: center;
  width: 17px;
  height: 17px;
}
.thmassedit{
  /* ...existing styles */
  place-content: center;
  width: 17px;
  height: 17px;
  margin-left: 10px;
  float: right;
  margin-right: 4px;
  margin-top: 2px;
}

.thmassdelete{
  /* ...existing styles */
  place-content: center;
  width: 17px;
  height: 17px;
  margin-left: 10px;
  float: right;
  margin-right: 4px;
  margin-top: 2px;
}
#product_data td:first-child{
    vertical-align: middle;
}
#dynamic_members{
	text-align: left;	
}
#static_members{
	text-align: left;	
}
span#dynamic_members.no-textarea {
	padding-left: 0;
}
span#static_members.no-textarea {
	padding-left: 0;
}

span#dynamic_members{
	padding-left: 50px;
}
span#static_members{
	padding-left: 50px;
}
.massedit::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--form-control-color);
}

.massedit:checked::before {
  transform: scale(1);
}
.fmassedit::before {
  content: "";
  width: 0.65em;
  height: 0.65em;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em var(--form-control-color);
}

.fmassedit:checked::before {
  transform: scale(1);
}
#productModalDiffPayment .top{
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}
div[style*="padding-bottom"] a.active-button {
    background-color: orange !important;
    color: white !important;
}
.columns-view{
	display:none;
}
.pie-view{
	display:none;
}
.sticks-view{
	display:none;
}
.area-view{
	display:none;
}
#pie-view{
	direction:ltr;
}
#columns-view{
	direction:ltr;
}
#sticks-view{
	direction:ltr;
}
#area-view{
	direction:ltr;
}
.chart-buttons{
	width:100%;
	display:flex;
	margin-bottom: 15px;
}
#reset-zoom-btn{
	border-radius: 0;
    border-style: solid;
    border-width: 0;
    cursor: pointer;
    font-weight: 400;
    line-height: normal;
    margin: -50px 0 1.25rem;
    text-align: center;
    display: inline-block;
    padding: 1rem 1rem 1.0625rem;
    font-size: 1rem;
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
}
ChartDialogDetailsChartDetailsSection-chartItem


.tbodyltr{
	direction:ltr;
}

.tbodyltr td:first-child{
	direction:rtl;
}
table.dataTable>tbody>tr.child ul{
	padding: 0 5px!important;
}
.ct-chart{
	min-height:400px;
}

.ct-chart .ct-series.ct-series-b .ct-bar, .ct-chart .ct-series.ct-series-b .ct-line, .ct-chart .ct-series.ct-series-b .ct-point, .ct-chart .ct-series.ct-series-b .ct-slice-donut {
    stroke: #7a6ff0!important;
}


.ct-chart .ct-legend {
	 position: relative;
	 z-index: 10;
	 list-style: none;
	 text-align: center;
	 bottom: 15px;
}
 .ct-chart .ct-legend li {
	 position: relative;
	 padding-left: 23px;
	 margin-right: 10px;
	 margin-bottom: 3px;
	 cursor: pointer;
	 display: inline-block;
}
 .ct-chart .ct-legend li:before {
	 width: 12px;
	 height: 12px;
	 position: absolute;
	 right: -17px;
	 top:5px;
	 content: '';
	 border: 3px solid transparent;
	 border-radius: 2px;
}
 .ct-chart .ct-legend li .inactive:before {
	 background: transparent;
}
 .ct-chart .ct-legend li:nth-child(1)::before {
	 background-color: #d70205;
}
 .ct-chart .ct-legend li:nth-child(2)::before {
	 background-color: #7a6eff;
}
 .ct-chart .ct-legend li:nth-child(3)::before {
	 background-color: #f4c63d;
}
 .ct-chart .ct-legend li:nth-child(1n+4)::before {
	 background-color: #F06292;
}
 .ct-chart .ct-legend .ct-legend-inside {
	 position: absolute;
	 top: 0;
	 right: 0;
}
 .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(1) .ct-point, .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(1) .ct-line {
	 stroke: #d70206;
}
 .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(2) .ct-point, .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(2) .ct-line {
	 stroke: #f05b4f;
}
 .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(3) .ct-point, .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(3) .ct-line {
	 stroke: #f4c63d;
}
 .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(1n+4) .ct-point, .ct-chart g:not(.ct-grids):not(.ct-labels) g:nth-child(1n+4) .ct-line {
	 stroke: #F06292;
}

.ct-area {
    fill-opacity: 0.15!important;
}
.ct-series-b .ct-area, .ct-series-b .ct-slice-donut-solid, .ct-series-b .ct-slice-pie {
    fill: #007bff!important;
}
.ct-chart .ct-series.ct-series-a .ct-bar, .ct-chart .ct-series.ct-series-a .ct-line, .ct-chart .ct-series.ct-series-a .ct-point, .ct-chart .ct-series.ct-series-a .ct-slice-donut {
     stroke: #d70206; 
}

.ct-chart .ct-label {
    fill: #212529;
    color: #343a40;
    font-size: 12px;
    line-height: 1;
}

#animating-donut .ct-label {
    fill: #fff;
    color: #fff;
    font-size: 13px;
    line-height: 1;
}

#animating-area .ct-label.ct-horizontal {
  text-align: center!important;
  position: absolute;
  left: -70px;
}

.daterangepicker .ranges li {
    width: 100%;
    text-align: right;
}
#count_up_timer{
	font-size:3rem;
	color:#008040;
	margin:20px;
}
.daterangepicker.dropdown-menu {
	min-width:177px;
}
.cf.col-md-4{
	width:23.4%!important;
}
.status-item.col-md-3{
	width:31.8%!important;
	max-width: 45%;
}
.status-item.col-md-4{
	width:23.4%!important;
}
.status-item.col-md-2{
	width:47.3%!important;
	max-width: 50%;
}
.rtl .sp-original-input-container{
	flex-direction: row-reverse;
}
.spectrum.th-add-on{
	direction:ltr;
}
.spectrum.with-add-on{
	direction:ltr;
}
.status-item-answered-calls{
	color:#51b355;
}
.dblock{
	display:block;
}
#customs-modal .modal-dialog{
	max-width:90%!important;
}
#customs-modal .modal-content{
	width:100%!important;
}
.multisteps-form{
	min-height:420px;
	height: auto;
    margin-bottom: 45px;
}
.campcheckbox{
	position: absolute;
    z-index: 9;
    right: 0;
    top: 6px;
}

#sendemail.multisteps-form__input.form-control { /* WebKit browsers */
  padding-right:115px;
}
#send_message{
	z-index:10
}
.savenote{
	float: left;
    margin-top: 20px;
}
#responsive-datatable-phones_wrapper .dataTables_filter{
	margin-left:100px;
}
#deleterows{
	position: relative;
    right: 61%;
    top: 35px;
}
.deleterow .fa-remove{
    font-size: 20px;
    color: #dc3545;
}
#loader {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 100000; /* Ensure it is on top of other elements */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8); /* Light overlay */
}

.spinner {
    border: 8px solid rgba(0, 0, 0, 0.1);
    border-left-color: #22a7f0;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#checknumbers{
	position: relative;
    right: 62%;
    top: 35px;
}
.checknumbers .fa-remove{
    font-size: 20px;
    color: #dc3545;
}
#addLicencesTable .fa-pencil-square{
    font-size: 18px;
    color: #188ae2;
}
.modal-dialog-showcampaign{
	max-width:inherit;
}
.modal-dialog-showcampaign .modal-content{
	height:700px;
}
.clear-both{
	clear:both;
}
.form-row .col .multisteps-form__title{
	padding:8px;
	border:1px solid #CCC;
	border-radius:5px;
	height:60px;
	padding-top: 18px;
}
.list-unstyled.topbar-right-menu{
	padding-top: 10px;
}
#runcampaign .fa-play-circle{
	margin-top: 5px;
    font-size: 81px!important;
}
.stopcampaign .fa-stop{
	margin-top: 5px;
    font-size: 35px!important;
    margin-right: 27%;
}
#runcampaign{
	width:100px;
    height: 100px;
	font-size: 1rem;
}
#trunk_num{
	direction: ltr;
    width: 9%!important;
    display: inline;
    position: relative;
    top: 15px;
    margin-left: 10px;
	margin-top: -14px;
}
#trunk_number{
    display: none;
}
.button-row{
	clear:both;
}
#responsive-datatable-phones-process_wrapper{
	overflow: auto;
    max-height: 240px;
}
#notes-modal{
	z-index:100;
}
.selected-green{
	background-color: #090!important;
}
.bordernone{
	border:none!important;
}
.check-bank.btn{
    width: auto;
    height: 2.4rem;
    font-size: 1rem;
    padding-left: 10px;
}
.check-bank.btn:hover{
    width: auto;
    height: 2.4rem;
    font-size: 1rem;
    padding-left: 10px;
}
.t-a{
    text-align: right;
}
.check-bank .mdi{
    font-size: 1.2rem;
    margin-right: 0.5rem;
    top: -2px;
    position: relative;
}
.check-bank .mdi:hover{
    font-size: 1.2rem;
    margin-right: 0.5rem;
    top: -2px;
    position: relative;
}
.check-bank.btn i{
    float: left;
}

.send_email_form{
    width: 363px;
    height: 270px;
    display: none;  
    top: 84px!important;
    position: absolute;
    left: 34px;
    float: left;
    background: var(--color-card-background);
    border: 1px solid #d7d4ff;
    border-radius: 8px;
    box-shadow: none;
    transition-duration: 200ms;
    transition-property: background,border-color,box-shadow;
    z-index: 1;
    background: #fff;
    
}
.send_email_form h4{
    font-size: 1.2rem;
    margin: 0;
    padding: 10px;
    background: #ebeff2;
}
.send_email_form h5{
    font-size: 1.1rem;
    text-align: center;
}
#send_report{
    float: left;
    margin-left: 50px;
    margin-top: 11px;
}
.show_report_list{
    float: right;
    margin-left: 5px;
}
.email_report_title{
    text-align: center;
    padding: 10px 10px 0 10px;
    color: #188ae2;
    font-size: 24px!important;
    font-weight: 500;
}
.email_report_subtitle{
    text-align: center;
    padding: 0 10px;
    color: #188ae2;
    font-size: 15px!important;
    font-weight: 500;
    margin-top: 0;
}
#show_email_reports{
z-index: 999999;
}
.myreports .modal-content{
    padding: 0!important;
    border-color: white!important;
}
.myreports .modal-content h4{
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}
.myreports .modal-body {
    padding: 0px 0!important;
}
.myreports .modal-dialog {
    max-width: 70%;
}
.myreports .top{
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
}
.closes{
    left: 0;
    padding: 0;
    position: absolute;
    padding: 10px;
    background: transparent;
    font-size: 28px;
    color: white;
    cursor: pointer;
	border: none;
}
.flatpickr-calendar {
	width: 100px !important;
}

.sys_alerts .dataTables_wrapper .dataTables_filter input,
select.sys_alerts .dataTables_wrapper .dataTables_filter input {
}

.select2-container--open .select2-dropdown--above{
	width: 247px!important;
}
.select2-container--open .select2-dropdown {
    left: 13px;
}
.all-emails{
    display: none;
    clear: both;
    text-align: right;
}
.all-emails span{
    cursor: pointer;
    color: red;
    font-weight: 800;
    margin: 0 10px;
    float: left;
}
.styled-table {
    border-collapse: collapse;
    margin: 0;
    font-size: 0.9em;
    font-family: sans-serif;
    min-width: 100%;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}
.styled-table thead tr {
    background-color: #41497a;
    color: #ffffff;
    text-align: left;
}
.styled-table th,
.styled-table td {
    padding: 9px 15px;
    text-align: center!important;
    font-size: 1.2em;
    line-height: 1.3rem;
    vertical-align: middle;
}
.styled-table tbody tr {
    border-bottom: 1px solid #dddddd;
}

.styled-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.styled-table tbody tr:last-of-type {
    border-bottom: 2px solid #009879;
}
.styled-table tbody tr.active-row {
    font-weight: bold;
    color: #009879;
}
.styled-table .mdi.mdi-email-plus{
    color: #4d63e3;
    font-size: 18px;
    margin: 0 0 0 10px;
    cursor: pointer;
}
.styled-table .mdi.mdi-content-save{
    left: -29px;
    position: absolute;
    color: #635ac7;
}
.delete_report{
    cursor: pointer;
    color: red;
    font-weight: 800;
}
.m-input{
    width: 80%;
}
.mail-class{
    text-align: right!important;
}
.email_field{
    position: relative;
}
#password2{
    text-align: left;
}
#password{
    text-align: left;
}
#password2::placeholder {
    text-align: right;
}
#password::placeholder {
    text-align: right;
}

.swal2-container.swal2-backdrop-show, .swal2-container.swal2-noanimation {
    z-index: 99999999;
}
.swal2-container{
    z-index: 99999999999;
}
.sweet_tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.sweet_tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #635ac7;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 10px;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

.sweet_tooltip:hover .tooltiptext {
  visibility: visible;
}

.myreports .select2-container{
    width: 207px!important;
}
.sweet_width{
    width: 250px!important;
}
.report-list-table .select2-container{
    display: none;
}
.delete-email{
    width: 100%;
}
.isonce{
    left: 0;
    position: absolute;
    height: 20px!important;
}
.flow-root{
    display: flow-root;
    margin-right: 20px;
}
#reg-form fieldset.enable {
    z-index: 1;
    opacity: 1;
    transition: all 0.5s ease-out 0.2s;
    transform: scale(1);
    animation: enable 0.5s ease-out 0.2s;
}
#reg-form fieldset {
    position: absolute;
    width: 300px;
    height: 60px;
    background: white;
    border-radius: 3px;
    opacity: 0;
    transform: scale(0.2);
    transition: all 0.4s ease-in-out;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5); 
}
#reg-form fieldset .icon.left {
    right: 10px;
}
#reg-form fieldset .icon {
    position: absolute;
    width: 30px;
    height: 30px;
    top: 15px;
    transition: all 0.4s ease;
}
#reg-form fieldset input {
    height: 40px;
    margin-top: 8px;
    border: none;
    outline: none;
}
#reg-form fieldset .icon {
    position: absolute;
    width: 30px;
    height: 30px;
    top: 15px;
    transition: all 0.4s ease;
}
.icon .arrow {
    width: 2px;
    height: 17px;
    top: 5px;
    left: 14px;
    background: #333333;
}
.icon .arrow::before {
    width: 6px;
    height: 6px;
    bottom: -1px;
    left: -3px;
    border-color: #333333;
    border-right: 2px solid;
    border-bottom: 2px solid;
    transform: rotate(45deg);
}
#savecondi{
	padding: 10px 20px!important;
	margin-bottom: 20px!important;
}
#reg-form fieldset .icon i::before, form fieldset .icon i::after {
    position: absolute;
    content: "";
}
.icon .user {
    width: 20px;
    height: 10px;
    bottom: 5px;
    left: 5px;
    box-shadow: 0 0 0 2px #198ae2 inset;
    border-radius: 6px 6px 3px 3px;
}

#reg-form fieldset .icon i {
    position: absolute;
    display: block;
}
.icon .user::before {
    width: 10px;
    height: 10px;
    top: -9px;
    left: 5px;
    box-shadow: 0 0 0 2px #198ae2 inset;
    border-radius: 50%;
}
#aemail{
    background: #fff;
}
.tesright{
    text-align: right;
    border-bottom: 1px solid #d7d4ff;
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
}

.dashboardtable > thead > tr > th{
    vertical-align: bottom!important;
    border-color: #ebeff2!important;
    border-bottom: 2px solid #dee2e6;
    background: none;
    color: #141414;
    background-color: #e8eaed;
    border-color: #dee2e6;
}
.dashboardtable > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr >         td, .table > thead > tr > th, .table-bordered {
    border-color: #dee2e6!important;
    text-align: center;
}

.dashboardtable  th {
    padding: 0.75rem!important;
    vertical-align: top!important;
    border-top: 1px solid #dee2e6;
    background-color: #e9ecef;
    border-color: #dee2e6;
}
.dashboardtable i{
    font-size: 19px;
    color: #25628F;
    line-height: 1px;
}
.dashboardtable span{
    font-size: 11px;
    display: flow-root;
}
.task-item:before{
   content: "\f01db";
    font-family: "Material Design Icons";
    position: absolute;
    left: 0;
    font-size: 19px;
    top: -3px;
}
.contact-table td{
    padding: 5px;
}
.content-client .close{
   left: 15px;
   top: 10px;
   color: grey;
}

.actside-bar {
    -moz-transition: all 200ms ease-out;
    -webkit-transition: all 200ms ease-out;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0px 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0px 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0px 0 rgba(0, 0, 0, 0.02);
    display: block;
    height: 100%;
    position: fixed;
    transition: all 200ms ease-out;
    width: 400px;
}

.actside-bar.actright-bar{
    float: left !important;
    left: -400px;
    top: 129px;
    height: 87%;
    max-height: 85vh;
}

.actright-bar .right-bar-toggle {
    float: left;
    line-height: 46px;
    font-size: 20px;
    color: #333;
    padding: 0 10px;
}
.actright-bar .right-bar-toggle {
    float: left;
    line-height: 46px;
    font-size: 20px;
    color: #333;
    padding: 0 10px;
}
.actright-bar {
    background: #ffffff !important;
    z-index: 9999 !important;
}
.notification-bell {
  animation: bell 1s 1s both infinite;
}
.notification-bell * {
  display: block;
  margin: 0 auto;
  background-color: #fff;
  box-shadow: 0px 0px 15px #fff;
}

.notification-count {
    position: absolute;
    z-index: 1;
    top: -6px;
    right: -7px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 15px;
    border-radius: 50%;
    background-color: #ff4927;
    color: #fff;
    text-align: center;
    animation: zoom 3s 3s both infinite;
}
.comment-count {
    position: absolute;
    z-index: 1;
    top: 10px;
    right: -7px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 15px;
    border-radius: 50%;
    background-color: #ff4927;
    color: #fff;
    text-align: center;
    animation: zoom 3s 3s both infinite;
}
.comment-eye{
    font-size: 20px!important;
    cursor: pointer;
}
.header-navheading {
    padding: 20px 20px 15px;
    text-align: center;
    background: white;
}

.dropdown-not:before {
    content: "";
    width: 13px;
    height: 13px;
    background: #ffffff;
    position: absolute;
    top: -7px;
    right: 28px;
    transform: rotate(45deg);
    border-top: 1px solid #f0f2f8;
    border-left: 1px solid #f0f2f8;
}
.main-notification-text {
    font-size: 13px;
    margin-bottom: 0;
    color: #3c4858;
}
.rtl .main-notification-text .badge {
    line-height: 1.5;
    margin-right: 20px;
    margin-left: auto;
}
.main-notification-text .badge {
    line-height: 1.5;
    margin-left: 20px;
    margin-right: auto;
}
.dropdown-not {
    width: 270px;
    position: absolute;
    top: 56px;
    left: auto;
    right: -28px;
    bottom: auto;
    padding: 0;
    border-width: 1px;
    box-shadow: -8px 12px 18px #15153e4d;
    border-radius: 4px;
    z-index: 9999;
    display: none;
}
.me-1{
	float: none;
	margin-right: 0.3rem
}
.external-event{
	width: 98.6%;
}
.toverlay{
	width: 100%; 
    height: 24.2rem; 
    overflow: auto; 
    border: 1px solid #ccc; 
    padding: 10px;
}
.toverlay::-webkit-scrollbar {
    width: 2px;
	background: linear-gradient(45deg, #0874af 0%, #6cbce8 100%);
}

.toverlay::-webkit-scrollbar-thumb {
    background-color: darkgrey;
    border-radius: 10px;
	background: linear-gradient(45deg, #0874af 0%, #6cbce8 100%);
}

.toverlay::-webkit-scrollbar-track {
    background: #f1f1f1;
	background: linear-gradient(45deg, #0874af 0%, #6cbce8 100%);
}

#btn-new-event{
	height: 8.8rem;
	width: 100%!important;
	text-align: center;
}
#product_form #action {
    margin-left: 10px !important;
}
#punchclock-datatable_filter{
	margin-right: 0
}
.badge.bg-pill{
    cursor: pointer;
}
.hide-phone {
    position: relative;
}
.btn-pbx{
    color: black !important;
    font: message-box;
    font-weight: bold !important;
    float: left;
}
.btn-msg{
    font: message-box;
    font-weight: bold !important;
    cursor: pointer;
}
.top-navi{
    margin-top: 15px;
}
@keyframes zoom {
  0% { opacity: 0; transform: scale(0); }
  10% { opacity: 1; transform: scale(1); }
  50% { opacity: 1; }
  51% { opacity: 0; }
  100% { opacity: 0; }
}
.notification-list.nicescroll{
    width: 100%;
}
#notification .modal-content{
    margin: 40% auto;
}
#notification .modal-body {
    padding: 0 0 20px 0;
}
#add_notification.modal{
}
#add_notification .modal-dialog{
    background: white;
    margin: 15% auto;
}
#add_notification .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_notification .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}
#add_notification .modal-header{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
#add_notification .top {
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    padding: 6px 0 12px 0;
    margin-bottom: 25px;
}

#add_notification .modal-dialog{
    background: white;
    margin: 15% auto;
}
#add_notification .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_notification .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}

#add_alert_form .modal-dialog{
    background: white;
    margin: 15% auto;
}
#add_alert_form .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_alert_form .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}
#add_alert_form .modal-header{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
#add_alert_form .top {
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    padding: 6px 0 12px 0;
    margin-bottom: 25px;
}

#add_alert_form .modal-dialog{
    background: white;
    margin: 15% auto;
}
#add_alert_form .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_alert_form .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}


#add_fsupport .modal-dialog{
    background: white;
    margin: 15% auto;
}
#add_fsupport .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_fsupport .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}
#add_fsupport .modal-header{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
#add_fsupport .top {
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    padding: 6px 0 12px 0;
    margin-bottom: 25px;
}

#add_fsupport .modal-dialog{
    background: white;
    margin: 15% auto;
}
#add_fsupport .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_fsupport .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}

#realtime-wrap{
    margin-top: 0;
}
#OperatorPanel .dt-buttons.btn-group{
	left: -6px;
}
#QueuePanel .dt-buttons.btn-group{
	left: -140px;
}
#showstatus .modal-dialog{
    background: white;
    margin: 10% auto;
}
#showstatus .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#showstatus .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}
#showstatus .modal-header{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
#showstatus .top {
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    padding: 6px 0 12px 0;
}

.callexplenation{
    padding: 9px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
#Call_Campaigns .dt-buttons, div#datatable-buttons_info{
    float: left;
    display: inline-block;
    position: absolute;
    left: 20px;
}
#showcampaign-modal .dt-buttons.btn-group{
    left: -142px;
}
#showcampaign-modal #deleterows {
    position: relative;
    right: 68%;
    top: 35px;
}
.rtl #responsive-datatable_wrapper .dataTables_length {
    left: 37%;
}
.rtl #RepresentativesPanels #responsive-datatable_wrapper .dataTables_length {
    left: 22%;
}
#users  .dataTables_length {
    left: -80%!important;
} 
.row-info{
    margin-right: 4px;
    margin-left: 1px;
}
.pointerEvents{
    pointer-events: none;
}
#Call_Campaigns .dataTables_filter {
    float: left;
    margin-left: 14%;
}
#responsive-datatable-phones_wrapper .dt-buttons.btn-group{
    left: -8.7%;
}
#add_licences .modal-dialog{
    max-width: 90%;
}
#add_licences .modal-dialog{
    background: white;
    margin: 9% auto;
}
#add_licences .modal-content{
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 0.3rem;
    outline: 0;
    margin: 0;
    padding: 0;
}
#add_licences .modal-content h4 {
    text-align: right;
    width: 100%;
    color: white;
    padding: 0 15px;
}
#add_licences .modal-header{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
#add_licences .top {
    background: #1979c3;
    display: flex;
    flex-direction: row;
    transition: height 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    padding: 6px 0 12px 0;
    margin-bottom: 25px;
}

#add_licences .modal-table{
    padding: 20px;
}
#add_licences .modal-footer{
    padding: 20px!important
}
.pbxnav {
    display: flex;
    align-items: stretch; /* Makes both divs equal height */
}

#secnav, #secondnav {
    flex: 1; /* Adjusts width proportionally if needed */
}
.notification-bar {
  position: absolute;
  width: 100%;
  z-index: 99999;
}
.notification-text {
  background-color: #f44336;
  padding: 10px 15px 10px 15px;
  color: #fff;
  font-size: 14px;
  text-align: center;
  position: absolute;
  width: 100%;
}

.notification-bar input {
  display: none;
}
.notification-bar label {
  cursor: pointer;
  color: #fff;
  position: absolute;
  z-index: 5;
  display: inline-block;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.rtl .notification-bar label[for=hide] {
  left: 15px;
  right: auto;
  top: 12px;
  width: 24px;
  height: 24px;
  background: url('../assets/img/close.png') no-repeat center center;
}
.notification-bar label[for=hide] {
  right: 15px;
  left: auto;
  top: 14px;
  width: 24px;
  height: 24px;
  background: url('../assets/img/close.png') no-repeat center center;
}
.rtl .notification-bar label[for=show] {
  width: 30px;
  height: 35px;
  border-radius: 0px 0px 3px 3px;
  left: 10px;
  right: auto;
  background: url('../assets/img/show.png') no-repeat center center #dc3545;
}
.notification-bar label[for=show] {
  width: 45px;
  height: 50px;
  border-radius: 0px 0px 3px 3px;
  right: 10px;
  left: auto;
  background: url('../assets/img/show.png') no-repeat center center #dc3545;
}
.notification-bar input[value=show]:checked ~ label[for=show] {
  -webkit-transition: ease 350ms;
  -moz-transition: ease 350ms;
  -o-transition: ease 350ms;
  transition: ease 350ms;
   
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.notification-bar input[value=show]:checked ~ label[for=show],
.notification-bar input[value=hide]:checked ~ label[for=hide],
.notification-bar input[value=hide]:checked ~ .notification-text {
  -webkit-transition: ease 350ms;
  -moz-transition: ease 350ms;
  -o-transition: ease 350ms;
  transition: ease 350ms;
   
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.notification-bar input[value=hide]:checked ~ label[for=show] {
  -webkit-transition: ease 350ms;
  -moz-transition: ease 350ms;
  -o-transition: ease 350ms;
  transition: ease 350ms;
   
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
}
.notification-bar input[value=show]:checked ~ label[for=hide],
.notification-bar input[value=show]:checked ~ .notification-text {
  -webkit-transition: ease 350ms;
  -moz-transition: ease 350ms;
  -o-transition: ease 350ms;
  transition: ease 350ms;
  
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  position: fixed;
}
@keyframes initiate {
  0% {
    transform:translateY(-100%);
  }
  50% {
    transform:translateY(-50%);
  }
  100% {
    transform:translateY(0%);
  } 
}
.notification-text {
	background-color: #f44336;
	padding: 10px 15px 10px 15px;
	color: #fff;
	font-size: 14px;
    font-weight: 700;
	text-align: center;
	position: absolute;
	width: 100%;

	-webkit-animation: initiate 350ms ease;
	-moz-animation: initiate 350ms ease;
	-o-animation: initiate 350ms ease;
	animation: initiate 350ms ease;
}
#slideshow { 
  height: 25px; 
  line-height: 35px;
}

#slideshow > div { 
  position: absolute; 
  top: 5px; 
  left: 10px; 
  right: 10px; 
  bottom: 5px; 
}
.isDisabled {
  color: currentColor;
  cursor: not-allowed;
  opacity: 0.5;
  text-decoration: none;
}
#addLicencesTable_paginate .ellipsis{
    display: none;
}
#allmessage-datatable_paginate .ellipsis{
    display: none;
}
#punchclock-datatable_paginate .ellipsis{
    display: none;
}
#addLicencesTable_wrapper .dt-buttons{
    left: -123px
}
#punchclock-datatable  > thead > tr > th:last-child {
     width: 6.5%!important;
}
.rtl #addLicencesTable_length{
    left: 23%;
}

#queue_data_paginate .paginate_button{
    background: #71b6f9;
}
#queue_data_paginate .ellipsis{
    display: none;
}
#queue_data_wrapper .paginate_button{
    background: #fff;
    color: #141414;
    border: 1px solid #ccc
}
#queue_data_wrapper .paginate_button.current{
    background: #188ae2;
    color: #fff;
    border: 1px solid #ccc
}
.priority{
    float: left;
}
.mdi-check-circle-outline{
    left: -5px;
    top: -11px;
    position: absolute;
    font-size: 43px;
}
.tasks .text-left, th, .tasks .table, .tasks .header-title, .tasks .header-title + p, .tasks .dropdown-item, .tasks .card-box, .tasks .select2-container--default .tasks .select2-results > .select2-results__options, .tasks .dropzone{
    text-align: right!important;
}
.tasks .card-box {
    padding: 20px;
}
.width100{
    width: 100%;
}
#apitoken{
   width: 69%;
   float: left;
   background: #dee2e6;
}
.apitoken{
   width: 89%!important; 
}
.stoken{
   display: block; 
}
.mdi-content-copy{
    color: #167ccb;
    cursor: pointer;
    margin-right: 2px;
}
.mdi-refresh{
    color: #167ccb;
    cursor: pointer;
    margin-left: 2px;
}
.m-t-3{
    margin-top: 3px!important;
}
.rtl .sorting{
    padding-right: 10px!important;
}
.opanel{
    padding: 0!important;
    background-color: #fff;
    background-color: transparent!important;
    position: absolute;
    right: 0;
    top: 0;
}
.op{
    position: relative;
}
.mdi.mdi-open-in-new{
    font-size: 18px;
}
.m-r-30{
    padding-right: 30px!important;
}
.active .mdi.mdi-open-in-new{
    color: white;
}

.active .badge.badge-dark{
    color: #141414;background: white;
}
.tab-container{
    padding: 0;
}
.tab-content {
    margin: -10px;
    margin-top: -4px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
    border: none !important;
	position: relative;
}
.btn-purple{
    border-color: #dee2e6!important
}
.searchpos{
    left: 42.8%;
}
#SmartNumsReports .searchpos{
    left: 1.7%;
}
#SmartNumsReports #reportrange{
	height: 20px;
	padding-top: 10px;
}
#SmartNumsReports .select2-selection{
	height: 39px;
}
#SmartNumsReports .select2-container--default .select2-selection--multiple .select2-selection__rendered{
	margin-top: 4px;
}
#search_button{
    width: 120px;
    text-align: center;
    height: 38px;
    margin-top: -2px;
}
.punchclock .table > thead > tr > th:last-child {
    width: 1%!important;
}

.punchclock #responsive-datatable > tbody > tr:first-child {
    pointer-events: auto!important;
}

.punchclock input[type="text"]{
    padding: 0 20px;
    text-align: center;
}
.punchclock tfoot td:nth-child(3){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(4){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(5){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(5):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(6){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(6):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(3):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclock tfoot td:nth-child(4):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}

.punchclocks  td:nth-child(3){
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px;
    font-weight: bold;
}
.punchclocks  td:nth-child(4){
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px;
    font-weight: bold;
}
.punchclocks  td:nth-child(5){
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px;
    font-weight: bold;
}
.punchclocks td:nth-child(5):hover{
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclocks  td:nth-child(6){
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px;
    font-weight: bold;
}
.punchclocks  td:nth-child(6):hover{
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclocks  td:nth-child(3):hover{
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclocks  td:nth-child(4):hover{
    background: #10c469;
    color: #3D983A!important;
    font-size: 18px!important;
    font-weight: bold;
}

.punchclockmodal .table > thead > tr > th:last-child {
    width: 1%!important;
}

.punchclockmodal #responsive-datatable > tbody > tr:first-child {
    pointer-events: auto!important;
}

.punchclockmodal input[type="text"]{
    padding: 0 20px;
    text-align: center;
}
.punchclockmodal tfoot td:nth-child(3){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(4){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(5){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(5):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(6){
    background: #10c469;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(6):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(3):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.punchclockmodal tfoot td:nth-child(4):hover{
    background: #10c469;
    color: white;
    font-size: 18px!important;
    font-weight: bold;
}
.coffee-to-go{
	cursor: pointer!important;
}
.vertical-middle{
	margin-left: 10px;
}
.lcustomers-button{
    cursor: pointer;
}
/*.punchclock tr:first-child td:nth-child(3){
    background: #ebeff2!important;
    color: white;
    font-size: 18px;
    font-weight: bold;
}
.punchclock tr:first-child td:nth-child(4){
    background: #ebeff2!important;
    color: white;
    font-size: 18px;
    font-weight: bold;
}*/
.specialW{
    width: 10%!important;
}
/*the container must be positioned relative:*/
.autocomplete {
  position: relative;
  display: inline-block;
}
.autocompletes {
  position: relative;
  display: inline-block;
}
.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0rem;
  right: 1rem;
  background: #fff;
  list-style: none;
}
.autocomplete-items li {
  padding: 8px;
  cursor: pointer;
  background-color: #fff; 
  border-bottom: 1px solid #d4d4d4; 
  width: 100%;
  margin-left: 0!important;
  font-family: system-ui;
}
.autocomplete-items li a{
  text-align: right;
  font-size: 14px;
  font-family: sans-serif;
  cursor: pointer;
  padding: 8px 0 7px 35%;
  color: #25628F;
}

.left-bar .app-search .form-control, .app-search ::placeholder:active{
    color: #141414!important;
}
.left-bar .app-search .form-control, .app-search ::placeholder{
    color: #141414!important;
}
.left-bar .app-search button{
    color: #141414!important;
}
.page-title-bar{
    width: 67%;
}
.clockpicker-popover .popover-title{
    direction: ltr;
}
/*when hovering an item:*/
.autocomplete-items li:hover {
  background-color: #e9e9e9; 
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}
.app-search .form-control, .app-search .form-control:focus{
    width: 100%;
}
.addrow{
   right: 69.55%; 
}
#addRow{
    height: 35px;
}
#comments-list{
    overflow: auto;
    height: 45vh;
}
.rtl .dltr{
    direction: ltr;
}
.rtl div.dataTables_wrapper #product_data_filter.dataTables_filter{
    text-align: right;
    float: right;
    direction: rtl;
    margin-right: -12px;
}
.rtl .licenses div.dataTables_wrapper #product_data_filter.dataTables_filter{
    margin-right: -6px!important;
}
.rtl #product_data_length.dataTables_length {
    float: left;
    width: 20%;
}
.rtl .punchclock .dataTables_filter{
    float: right;
    margin-right: -162px;
    margin-left: 0;
}
.rtl .punchclock .dataTables_length{
    float: left;
    position: relative;
    left: 31%;
}

#OperatorPanelReport .dt-buttons,#SmartNumsReports .dt-buttons, div#datatable-buttons_info{
    left: -7.7%;
}
.org_queue .dt-buttons, div#datatable-buttons_info{
    left: -7.7%;
}

#OperatorPanelReport .searchpos{
    left: 58.8%;
}

.rtl #OperatorPanelReport .dataTables_length{
    left: 25%;
}
#QcountDays{
    width: 80%;
}
#twoFAdest{
    width: 80%;
}
#IPACL{
    width: 80%;
}
#crmLink{
    width: 80%;
}
#shortcuts{
    width: 80%;
}
.mdi-content-save-settings{
    color: #167ccb;
    cursor: pointer;
    margin-right: 2px;
}
#product_data td{
    position: relative;
    vertical-align: middle;
}
#responsive-datatable td{
    position: relative;
    vertical-align: middle;
}
#responsive-datatable td:first-child + td{
    direction: ltr;
}

#cdReport #responsive-datatable td{
    direction: ltr!important;
}

.EXTcountgreen{
    background: greenyellow;
    padding: 15% 42%;
    position: absolute; 
    top: 0;
    left: 0;
}
.EXTcountyellow{
    background: #e9e947;
    padding: 15% 42%;
    position: absolute;
    top: 0;
    left: 0;
}
.EXTcountorange{
    background: orange;
    padding: 15% 42%;
    position: absolute;
    top: 0;
    left: 0;
}
.EXTcountred{
    background: #D03335;
    padding: 15% 42%;
    position: absolute;
    top: 0;
    left: 0;
}
.HDred{
    background: #D03335;
    padding: 20% 42%;
    position: absolute;
	color: white!important;
    top: 0;
    left: 0;
}

.mdi.mdi-restore-clock{
    color: #25628f;
}
.ui-helper-hidden-accessible {
    display: none;
    position: absolute;
    left: -10em;
    background-color: yellow;
    z-index: 1000;
}
.punchclockmodal.in{
    z-index: 999999!important;
    width: 100%; 
}
.punchclockmodal .modal-dialog{
    max-width: 100%!important;
    margin: 8% 10%;
    width: 80%;
}
.punchclockmodal .modal-body{
    height: 27.3rem;
    padding: 25px!important;
    overflow: auto;
}
.punchclockmodal .modal-content{
    padding: 0!important;
}
.punchclockmodal .modal-footer{
    padding: 25px 25px 10px 25px!important;
}

.punchclockmodal .modal-header{
    padding: 25px!important;
    line-height: 22px;
    font-size: 20px;
    background-color: #fff;
    color: #25628F;
    text-align: right;
    margin: 0px;
    width: 100%;
    border-bottom: 1px solid #e1e1e1;
}

.tableGrid .dt-buttons, div#datatable-buttons_info {
    
}

.punchclockmodal .dt-buttons, div#datatable-buttons_info{
    left: -11.3%;
}
.punchclock .dt-buttons, div#datatable-buttons_info{
    left: -8.8%;
}
.modal-footer button{
    background-color: #188ae2;
    color: white;
}

.punchclockmodal .tableGrid .fa.fa-pencil{
    display: none;
}
.lcustomersmodal.in{
    z-index: 999999!important;
    width: 100%; 
}
.lcustomersmodal .modal-dialog{
    max-width: 100%!important;
    margin: 8% 10%;
    width: 80%;
}
.lcustomersmodal .modal-body{
    height: 27.3rem;
    padding: 25px!important;
    overflow: auto;
}
.lcustomersmodal .modal-content{
    padding: 0!important;
}
.lcustomersmodal .modal-footer{
    padding: 25px 25px 10px 25px!important;
}

.lcustomersmodal .modal-header{
    padding: 25px!important;
    line-height: 22px;
    font-size: 20px;
    background-color: #fff;
    color: #25628F;
    text-align: right;
    margin: 0px;
    width: 100%;
    border-bottom: 1px solid #e1e1e1;
}


.lcustomersmodal .dt-buttons, div#datatable-buttons_info{
    left: -10.5%;
}


.lcustomersmodal .tableGrid .fa.fa-pencil{
    display: none;
}

.licenses #product_data_wrapper .dt-buttons, div#datatable-buttons_info{
    position: absolute;
    left: 0.1%;
    top: 27px;
}
.lcustomersmodal .dt-buttons, div#datatable-buttons_info{
    position: absolute;
    left: 2.5%;
    top: 27px;
}
.showprice_cost{
    position: relative;
    top: -24px;
    left: -34px;
}
#showmycost{
    display: none;
}
#price_cost_check{
    width: 30px!important;
    height: 30px;
    position: relative;
    left: 22px;
    top: 31px;
}
.showcostdiv{
    height: 16px;
}
#product_data_wrapper .buttons-html5{
    float: right;
}
.adduser{
    padding: 2px!important;
    padding-bottom: 2px!important;
    padding-top: 2px!important;
    margin-bottom: 0!important;
}
.addexcel{
    float: left;
    margin-bottom: 8px;
}
.chnagepbx{
    float: left;
    margin-left: 12px;
}
#product_data_search th input{
    margin-bottom: 6px!important;
}
th input{
	border-color: #F3F0F0;
	border-width: 1px;
	border-style: ridge;
}
.swal2-rtl .swal2-timer-progress-bar{
    background: red;
}
.hi-icon-wrap .mdi{
    font-size: 15px!important;
    float: right;
    margin-right: 20px;
    margin-left: 0;
}
.rtl .hi-icon-wrap .mdi{
    font-size: 15px!important;
    float: left;
    margin-left: 20px;
    margin-right: 0;
}
.hi-icon-effect-4 .mdi {
    background: rgba(255,255,255,0.1);
    -webkit-transition: background 0.2s, color 0.2s;
    -moz-transition: background 0.2s, color 0.2s;
    transition: background 0.2s, color 0.2s;
}
.hi-icon-effect-4 .mdi-email-plus-outline {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #005cbf!important;
}
.hi-icon-effect-4 .mdi-email-plus-outline:before {
    speak: none;
    font-size: 38px;
    line-height: 38px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}
.hi-icon-effect-4 .mdi-email-plus-outline:hover::before {
    font-size: 28px;
}
.hi-icon-effect-4 .mdi-email-plus-outline:after {
    top: -7px;
    left: -7px;
    padding: 7px;
    box-shadow: 0 0 0 4px #005cbf;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.2s, opacity 0.2s;
    transform: scale(.8);
    opacity: 0;
}
.hi-icon-effect-4 .mdi-email-plus-outline:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

 .hi-icon-effect-4 .mdi-deskphone, .mdi-phone-pvoip {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #005cbf;
}
.hi-icon-effect-4 .mdi-deskphone:before {
    speak: none;
    font-size: 38px;
    line-height: 38px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}

.hi-icon-effect-4 .mdi-phone-pvoip:before {
    speak: none;
    font-size: 34px;
    line-height: 38px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}

.hi-icon-effect-4 .mdi-deskphone:hover::before, .mdi-phone-pvoip:hover::before {
    font-size: 28px;
}

.hi-icon-effect-4 .mdi-deskphone:after, .mdi-phone-pvoip:after {
    top: -7px;
    left: -7px;
    padding: 7px;
    box-shadow: 0 0 0 4px #005cbf;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.2s, opacity 0.2s;
    transform: scale(.8);
    opacity: 0;
}
.hi-icon-effect-4 .mdi-deskphone:after, .mdi-phone-pvoip:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.hi-icon-effect-4 .mdi-account-card-details {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #005cbf!important;
}
.hi-icon-effect-4 .mdi-account-card-details:before {
    speak: none;
    font-size: 38px;
    line-height: 38px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}
.hi-icon-effect-4 .mdi-account-card-details:hover::before {
    font-size: 28px;
}
.hi-icon-effect-4 .mdi-account-card-details:after {
    top: -7px;
    left: -7px;
    padding: 7px;
    box-shadow: 0 0 0 4px #005cbf;
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.2s, opacity 0.2s;
    transform: scale(.8);
    opacity: 0;
}
.hi-icon-effect-4 .mdi-account-card-details:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
.hi-icon-effect-4a .mdi:hover {
    background: #005cbf;
    color: #fff!important;
    
}
.hi-icon-effect-4a .mdi:hover::after {
    opacity: 1;
}
.input-with-post-icon.datepicker{
    padding: 0;
}

.tabs {
	display: flex;
	flex-wrap: wrap; 
}
.tabs label {
	order: 1; 
	display: block;
	padding: 0.5rem 2rem;
	margin-left: 0.2rem;
	cursor: pointer;
  font-weight: bold;
  transition: background ease 0.2s;
    margin-bottom: 0;
    color: #141414
}
.tabs .tab {
  order: 99; 
  flex-grow: 1;
	width: 100%;
	display: none;
  padding: 1rem;
  background: #fff;
}
.tabs input[type="radio"] {
	display: none;
}
.tabs input[type="radio"]:checked + label {
	background: #fff;
}
.tabs input[type="radio"]:checked + label + .tab {
	display: block;
}

@media (max-width: 45em) {
  .tabs .tab,
  .tabs label {
    order: initial;
  }
  .tabs label {
    width: 100%;
    margin-right: 0;
    margin-top: 0.2rem;
  }
}



/*****color****/
#tabone-content {
  color: white;
  background: red;
}

#tabtwo-content {
  color: white;
  background: #f9c851;
}

#tab3-content {
  color: white;
  background: #10c469;
}


#tab3-tab {
  color: white;
  background: #8bc53e;
}

#tabfour-tab {
  color: white;
  background: #35b8e0;
  padding: 0;
  padding-top: 20px;
}
.mtab-content{
  padding: 0!important;
  padding-top: 5px!important;
}
#tabfour-content {
  color: white;
  background: #35b8e0;
}
#tab5-content {
  color: white;
  background: #25628f;
}


#tab5-tab {
  color: white;
  background: #25628f;
}
#tabfive-content {
  color: white;
  background: #25628f;
}

#tab6-content {
  color: white;
  background: #CC3B3B;
}


#tab6-tab {
  color: white;
  background: #CC3B3B;
}
#tabsix-content {
  color: white;
  background: #CC3B3B;
}
	
#tab-content{
    background: white;
    padding: 10px 0 10px 0;
}
#custom-target {
  position: relative;
  width: 600px!important;
  height: 100px!important;
  border-style: solid;
}

.position-absolute {
  position: absolute;
}
.swal2-popup.swal2-toast .swal2-html-container{
    padding: 0 20px 0 20px;
}
.toast-center {
    position: fixed;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.containerb {
	display: inline-grid;
	width: 100%;
	grid-template-columns: 1fr 2fr;
	gap: 20px;
	padding: 20px;
	background-color: #f9f9f9;
	border: 2px solid #188ae2;
	margin-top: 30px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	direction: ltr;
}
.containerb h2{
	text-align: center;
	font-size: 16px;
	color: #188ae2;
	font-weight: 700;
	font-weight: 700;
	margin: 0;
}
.left-section {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.waiting-boxes {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: #66cf89;
	padding: 20px;
	border-radius: 10px;
	text-align: center;
}

.waiting-boxes h2 {
	margin: 0;
	font-size: 36px;
}

.waiting-boxes span {
	font-size: 14px;
	margin-top: 5px;
}

.time-boxes {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: #66cf89;
	padding: 20px;
	border-radius: 10px;
	text-align: center;
}

.time-boxes h2 {
	margin: 0;
	font-size: 36px;
}

.time-boxes span {
	font-size: 14px;
	margin-top: 5px;
}
#RepresentativesPanels{
	margin-top: -40px!important;
}
.queue-table {
	overflow-x: auto;
	direction: rtl;
	position: relative;
	overflow: visible;
}

.queue-table table {
	width: 100%;
	border-collapse: collapse;
}

.queue-table th,
.queue-table td {
	border: 1px solid #ddd;
	padding: 8px;
	text-align: center;
}

.queue-table th {
	background-color: #188ae2;
	color: #fff;
	font-weight: bold;
	text-align: center !important;
}

.queue-table td {
	background-color: #f9f9f9;
}

.queue-table tr:nth-child(even) td {
	background-color: #f2f2f2;
}
#queueselect + .select2-container {
    position: absolute;
    top: -5px;
    left: 75%;
    width: 200px !important;
	z-index: 10;
}
.edit-profile #queueselect + .select2-container {
    position: relative;
    top: -5px;
    left: 0!important;
    width: 100% !important;
	z-index: 10;
}
.clink{
    width: 100%;
    text-align: center;
    float: left;
}
.tabby-tab {
	max-width: 100%!important;
}
.notactivecustomer{
   background:#ff5b5b!important;
}
.notactivecustomer a{
    color: #fff!important;
    padding-right: 20px!important;
}
.customeractive a{
    padding-right: 20px!important;
}
.optiontitle{
    font-size: 16px;
    background: #dee2e6!important;
    font-weight: 600;
}
.warning a{
   color: white!important; 
}

.warning{
   background: #ff5b5b!important;
   padding: 8px 30px!important;
}

.danger{
   background: #f9c851!important;
   padding: 8px 30px!important;
}
.danger a{
   color: white!important; 
}
.mdanger{
   background: #f9c851!important;
   padding: 8px 30px!important;
}
.mdanger a{
   color: white!important; 
}
.inform{
   background: #10c469!important;
   padding: 8px 30px!important;
}
.inform a{
   color: white!important; 
}

.warning a{
   color: white!important; 
}

.warning{
   background: #ff5b5b!important;
   padding: 8px 30px!important;
}

.danger{
   background: #f9c851!important;
   padding: 8px 30px!important;
}
.danger a{
   color: white!important; 
}
.mdanger{
   background: #f9c851!important;
   padding: 8px 30px!important;
}
.mdanger a{
   color: white!important; 
}
.inform{
   background: #10c469!important;
   padding: 8px 30px!important;
}
.inform a{
   color: white!important; 
}

.nwarning a{
   color: white!important; 
   text-align: center;
}

.nwarning{
   background: #f9c851!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.nwarning{
   background: #f9c851!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}

.ndebitcredit a{
   color: white!important; 
   text-align: center;
}

.ndebitcredit{
   background: #E4236B!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.ndebitcredit{
   background: #E4236B!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}

#timemessage-datatable .nwarning{
   width: 100%;
}
.ndanger{
   background: #ff5b5b!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.ndanger a{
   color: white!important;
   text-align: center;
}
.nmdanger{
   background: #ff5b5b!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.nmdanger a{
   color: white!important; 
   text-align: center;
}
.ninform{
   background: #10c469!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.ninform a{
   color: white!important;
   text-align: center;
}
.ninfo{
   background: #4a81d4!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.ninfo a{
   color: white!important;
   text-align: center;
}
.nsupport{
   background: #4a81d4!important;
   padding: 6px 20px!important;
   text-align: center;
   width: 80%;
}
.alert-container .cursors{
    cursor: pointer!important;
    margin-left: 5px;
}
select .badge-support{
   background: #E4236B!important;
   padding: 3px 4px!important;
   text-align: right;
}
select .badge-debitcredit{
   background: #E4236B!important;
   padding: 3px 4px!important;
   text-align: right;
}	
select .badge-warning{
   background: #f9c851!important;
   padding: 3px 4px!important;
   font-size: 14px!important;
   color: white;
   text-align: right;
}
select .badge-urgent{
   background: #cd2525!important;
   padding: 3px 4px!important;
   font-size: 14px;
   color: white;
   text-align: right;
}
select .badge-red{
   background: #910505!important;
   padding: 3px 4px!important;
   font-size: 14px;
   color: white;
   text-align: right;
}
select .badge-inform{
   background: #477ED1!important;
   padding: 3px 4px!important;
   font-size: 14px;
   color: white;
   text-align: right;
}
select .badge-normal{
   background: #5b69bc!important;
   padding: 3px 4px!important;
   font-size: 14px!important;
   color: white;
   text-align: right;
}
select .badge-support{
   background: #1E437B!important;
   padding: 3px 4px!important;
   font-size: 14px!important;
   color: white;
   text-align: right;
}
select .badge-info{
   background: #35b8e0!important;
   padding: 3px 4px!important;
   font-size: 14px!important;
   color: white;
   text-align: right;
}
select .badge-success{
   background: #10c469!important;
   padding: 3px 4px!important;
   font-size: 14px!important;
   color: white;
   text-align: right;
}

.sender_logo.badge-urgent{
   background: #cd2525!important;
   padding: 3px 4px!important;
   font-size: 13px;
   color: white;
   text-align: right;
}
.sender_logo.badge-red{
   background: #910505!important;
   padding: 3px 4px!important;
   font-size: 13px;
   color: white;
   text-align: right;
}
.sender_logo.badge-inform{
   background: #477ED1!important;
   padding: 3px 4px!important;
   font-size: 13px;
   color: white;
   text-align: right;
}
.sender_logo.badge-normal{
   background: #5b69bc!important;
   padding: 3px 4px!important;
   font-size: 13px!important;
   color: white;
   text-align: right;
}
.sender_logo.badge-support{
   background: #1E437B!important;
   padding: 3px 4px!important;
   font-size: 13px!important;
   color: white;
   text-align: right;
}
.sender_logo.badge-success{
   background: #10c469!important;
   padding: 3px 4px!important;
   font-size: 13px!important;
   color: white;
   text-align: right;
}
.accounting-table.hide-last-columns td:nth-last-child(-n+4) {
    display: none;
}
.nupport a{
   color: white!important;
   text-align: center;
}
.taskslist .badge{
    width: 100%;
    text-align: center;
}
.taskslist select .badge{
    text-align: inherit!important;
}
.taskslist .row{
    display: block;
}
.sys_alerts .badge{
    width: 100%;
    text-align: center;
}

.alert-container {
  position: fixed;
  top: 130px;
  right: -400px; /* Offscreen to the right */
  width: 400px;
  height: auto;
  background-color: #f0f0f0;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  border: 2px solid #007bff; /* Add a nice border around the alert */
  overflow: hidden;
  z-index: 9999;
  transition: right 0.5s ease-in-out;
}
.p-15{
    padding: 10px
}
.alert-message {
  color: #333;
  font-weight: 500;
  padding: 3px 15px;
  width: 100%;
}

.alert-tmessage {
  color: #333;
  font-weight: bold;
  padding: 3px 15px;
  width: 100%;
}

.alert-smessage {
  color: #333;
  font-weight: 500;
  padding: 3px 15px;
  width: 100%;
}

.alert-close {
  background-color: #007bff;
  color: #fff;
  cursor: pointer;
  padding: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

/* Frame styles */
.alert-container.show {
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); /* Update the box-shadow when shown */
}

.alert-container .alert-message {
  border-radius: 3px; /* Adjust border-radius to your liking */
}

/* Animation when sliding in */
@keyframes slideInRight {
  from {
    right: -250px;
  }
  to {
    right: 10px;
  }
}

/* Animation when sliding out */
@keyframes slideOutRight {
  from {
    right: 10px;
  }
  to {
    right: -250px;
  }
}

/* Apply slideInRight animation to the container when it's shown */
.alert-container.show {
  animation: slideInRight 0.5s forwards;
}

/* Apply slideOutRight animation to the container when it's hidden */
.alert-container.hide {
  animation: slideOutRight 0.5s forwards;
}

table.dataTable tbody td.select-checkbox:before, table.dataTable tbody th.select-checkbox:before{
    border: 1px solid #abaaaa!important;
}
table.dataTable tbody td.select-checkbox:before, table.dataTable tbody td.select-checkbox:after, table.dataTable tbody th.select-checkbox:before, table.dataTable tbody th.select-checkbox:after{
    width: 16px!important;
    height: 16px!important;
}
#allmessage-datatable td:nth-child(7){
  overflow: hidden;
  text-overflow: ellipsis;
  background: white;
  resize: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  contain-intrinsic-height: 250px;
  overflow: hidden;
  height: 50px;
  /* max-width: 12rem; */
}
#punchclock-datatable td:nth-child(7){
  overflow: hidden;
  text-overflow: ellipsis;
  background: white;
  resize: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  contain-intrinsic-height: 250px;
  overflow: hidden;
  height: 50px;
  /* max-width: 12rem; */
}
#timemessage-datatable td:nth-child(7){
  overflow: hidden;
  text-overflow: ellipsis;
  background: white;
  resize: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  contain-intrinsic-height: 250px;
  overflow: hidden;
  height: 50px;
  max-width: 34rem;
    
}
#inform-datatable td:nth-child(5){
  overflow: hidden;
  text-overflow: ellipsis;
  background: white;
  resize: vertical;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  contain-intrinsic-height: 250px;
  overflow: hidden;
  height: 50px;
  max-width: 34rem;
    
}
#fieldContainer .mdi-playlist-remove{
    color: red;
    cursor: pointer;
    font-size: 17px;
}
.add-params #addField{
    padding: 0 5px 0 5px;
}
.add-params .mdi-playlist-plus{
    font-size: 13px;
}
.font-bold{
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: 10px;
}
.link{
    color: indianred!important;
    cursor: pointer;
}
.center{
    text-align: center!important; 
    border: none;
}
#product_form input{
    width: 93%;
	
}
#product_form select{
    width: 93%;
}
#stocknames{
    width: 95.2%!important;
}
#stockname{
	width: 300px!important;
}
.selection .select2-container--default .select2-results {
    width: 300px; /* Match this with the width of the select element */
}
#isfree{
	width: 118px!important;
}
.isfreeselect .select2-search__field{
	width: 33.656px !important;
    position: absolute;
    right: 2px;
	margin-top: 7px !important;
}

/* Add a placeholder text to the container */
.isfreeselect .select2-container--default .select2-selection--multiple::before {
    content: 'בחר מאגרים לחיפוש'; /* Placeholder text */
    color: #aaa; /* Placeholder text color */
    position: absolute;
    right: 10px; /* Adjust as needed */
    top: 50%; /* Center vertically */
    transform: translateY(-50%);
    pointer-events: none; /* Prevent the placeholder from interfering with interactions */
    font-style: italic; /* Optional: to make the placeholder text italic */
}

.isfreeselect .select2-container--default .select2-selection--multiple.has-items::before {
    content: ''; /* Hide the placeholder */
}

.isfreeselect .select2-container .select2-selection--multiple {
    min-height: 35px; /* Set the desired height */
    max-height: 35px; /* Keep the height fixed */
    overflow: hidden; /* Allow scrolling if there are many selections */
}

.isfreeselect .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    max-height: 38px; /* Adjust inner content height */
    overflow: hidden;
}
.reportrangestock{
	height: 31px;
	margin-bottom: 6px !important;
}
#product_form .select2-selection--multiple{
    width: 93%;
}
#product_form .btn.btn-success{
    width: auto;
}
#productModal .modal-dialog{
   width: 500px;    
}
#productModal input{
   width: 100%;    
}
#product_data table { text-align: right; direction: rtl;}
#product_data th,tr {text-align: right; direction: rtl;}
#product_data tr:hover { background: #188ae2; color: #fff!important;}
#product_data tr:hover .clientrow{color: #fff!important;}
#product_data tr:hover .waves-success{background: red!important; color: #fff!important;border: none!important;border-color:red!important;font-size: 13px;}
.bhover tr:hover { background: #188ae2!important; color: #fff!important;}
.bhover tr:hover span { color: #fff!important;}
#product_data tr:hover .aligneto i{
    color: #fff;
}
.font-22{
    font-size: 22px!important;
}
.bg-tasks{
    background: #214C98;
    width: 60px;
    height: 60px;
}
.bg-tasks i{
    position: absolute;
    top: 13px;
    right: 28px;
}
.send-reload{
	width: 100%!important;
    line-height: 37px;
	cursor: pointer;
}
.ms-auto.me-2{
	display: none;
}
.bg-warning{
    background: #E7BE48;
    width: 60px;
    height: 60px;
}
.toast.bg-warning{
    background: #E7BE48;
    width: auto;
    height: auto;
    cursor: pointer;
}
.bg-warning i{
    position: absolute;
    top: 13px;
    right: 28px;
}
.send-ticket .bg-warning{
    width: auto;
    height: 18px;
}
.bg-success{
    background: #42C94D;
    width: 60px;
    height: 60px;
}
.bg-success i{
    position: absolute;
    top: 13px;
    right: 28px;
}
.bg-danger{
    background: #B14338;
    width: 60px;
    height: 60px;
}
.bg-danger i{
    position: absolute;
    top: 13px;
    right: 28px;
}
.bg-asuccess{
    background: #007bff;
    width: 60px;
    height: 60px;
}
.bg-asuccess i{
    color: white;
    margin: 10% 18%;
}
.w-84{
    width: 84%!important;
}
.bell-status{
    font-size: 23px!important;
    color: #98a6ad;
    cursor: pointer;
}
#responsive-datatable tr:hover .bell-status {
    color: white;
}
.white-div {
  position: absolute;
  background-color: white;
  border: 1px solid #ccc;
  padding: 18px 10px;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Add a subtle box shadow */
  z-index: 999; /* Ensure the div appears above other content */
  width: 176px;
  height: 175px;
  line-height: 15px; /* Center content vertically */
  font-size: 12px;
  color: #333;
  text-align: center;
}
.mdi-comment-text-multiple-outline{
    margin-left: 0!important;
    margin-right: 0!important;
    color:#f9c851;
    cursor: pointer;
}
.act-comments{
    cursor: pointer;
}
.m-r--4{
    margin-right: -4px;
}
.actright-bar h4 {
    border-bottom: 1px solid rgba(152, 166, 173, 0.5);
    padding: 4px 10px 10px 18px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.03em;
}
.actright-bar .actright-bar-toggle {
    float: left;
    line-height: 46px;
    font-size: 20px;
    color: #333;
    padding: 0 10px;
}
.delaydiv{
    position: fixed!important;
    left: auto!important;
}
#add_msupport{
    height: 100%;
    display: inline-flex;
    line-height: 1;
    padding: 0;
    align-items: center;
	margin-top: 6px;
}
.selectcategory{
    width: 100%;
    direction: rtl;
}
.selectcategory .datepicker{
    width: 155px;
    padding: 10px;
    margin-top: 5px;
    font-size: 13px;
}
.selectcategory .lbl{
    margin-top: 5px;
    text-align: right;
}
.addalert{
    margin-top: 11px;
}
.edge{
   right: auto!important;
   left: 0!important; 
}
.p-t-16{
	padding-top: 16px !important;
}
.settings .card-body{
    padding: 1.25rem 0.8rem 1.25rem 0.8rem;
}
.settings .col-sm-5,.col-sm-4,.col-sm-7{
    padding: 0
}
.settings .col-sm-3{
    padding-right: 0
}
.settings .mdi-help-circle-outline{
    position: absolute;
    color: #286090;
    font-size: 20px;
    top: 5px;
    right: 3px;
    left: auto;
}
.rtl .settings .mdi-help-circle-outline{
    left: 3px;
    right: auto;
}

.rtl .activities .mdi-help-circle-outline{
    left: -15px;
    right: auto;
    top: 2px;
    z-index: 2;
}
#color_class{
    width: 64%;
}
.menucontext{
    cursor: pointer;
}
.copycontext{
    font-size: 18px!important;
    margin-right: 10px;
}
.miniPBX .mdi-help-circle-outline{
    color: #286090;
    margin-left: 3px;
    cursor: help;
}
.miniPBX .btn{
    padding: 0.5em 1.8em;
}
.rtl .miniPBX .mdi-help-circle-outline{
   left: 3px;
    right: auto;
}
.left55{
    left: 55px!important;
}
.left-45{
    left: -45px!important;
}
.taskslist .mdi {
    font-size: 14px;
    float: right;
    margin-left: 10px;
}
.taskedit .mdi {
    font-size: 14px;
    float: left;
    margin-left: 4px;
    cursor: pointer;
}

#categorieslistb .mdi{
    font-size: 14px;
    float: right;
    margin-left: 10px;
}
.timepicker-container {
    position: relative;
    display: inline-block;
}

.timepick {
    padding-right: 30px; /* Make room for the button */
}

.set-star {
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background-color: #007bff;
    color: #fff;
    padding: 4px 8px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
	display: none;
	height: 17px;
    transition: background-color 0.3s;
}

.star-btn:hover {
    background-color: #0056b3;
}

.timepick{
    width: 50%;
}
.showalert{
    float: left;
    top: -30px;
    position: relative;
    right: 2px;
}
.settings .btn-showtb{
    margin-top: 0;
    margin-bottom: 10px!important;
    margin: -9px 10px 10px 10px;
}
.sys_alerts .mdi {
    font-size: 14px;
    float: right;
    margin-left: 10px;
    cursor: pointer;
}


.taskdelete .mdi {
    font-size: 14px;
    float: left;
    margin-left: 0;
}
#allmessage-datatable.table>:not(caption)>*>* {
    padding: 0.85rem 0.85rem;
    background-color: var(--ct-table-bg)!important;
    border-bottom-width: 1px!important;
    -webkit-box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    border-bottom-color: #dee2e6!important;
    border-right-width: 0;
}
#allmessage-datatable.table > thead > tr > th {
    vertical-align: bottom;
    border-color: #ebeff2!important;
    padding: 5px;
    background: #188ae2;
    color: #141414;
    text-align: center!important;
    border-bottom-color: #dee2e6!important;
    border-bottom-width: 2px!important;
    max-width: 12rem;
}
#punchclock-datatable.table>:not(caption)>*>* {
    padding: 0.85rem 0.85rem;
    background-color: var(--ct-table-bg)!important;
    border-bottom-width: 1px!important;
    -webkit-box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    border-bottom-color: #dee2e6!important;
    border-right-width: 0;
}
#punchclock-datatable.table > thead > tr > th {
    vertical-align: bottom;
    border-color: #ebeff2!important;
    padding: 5px;
    background: #188ae2;
    color: #141414;
    text-align: center!important;
    border-bottom-color: #dee2e6!important;
    border-bottom-width: 2px!important;
    max-width: 12rem;
}

#timemessage-datatable.table>:not(caption)>*>* {
    padding: 0.85rem 0.85rem;
    background-color: var(--ct-table-bg)!important;
    border-bottom-width: 1px!important;
    -webkit-box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    border-bottom-color: #dee2e6!important;
    border-right-width: 0;
}
#timemessage-datatable.table > thead > tr > th {
    vertical-align: bottom;
    border-color: #ebeff2!important;
    padding: 5px;
    background: #188ae2;
    color: #141414;
    text-align: center!important;
    border-bottom-color: #dee2e6!important;
    border-bottom-width: 2px!important;
}

.bluebe_datatable.table>:not(caption)>*>* {
    padding: 0.85rem 0.85rem;
    background-color: var(--ct-table-bg)!important;
    border-bottom-width: 1px!important;
    -webkit-box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg)!important;
    border-bottom-color: #dee2e6!important;
    border-right-width: 0;
}
.bluebe_datatable.table > thead > tr > th {
    vertical-align: bottom;
    border-color: #ebeff2!important;
    padding: 5px;
    background: #188ae2;
    color: #141414!important;
    text-align: center!important;
    border-bottom-color: #dee2e6!important;
    border-bottom-width: 2px!important;
}
.mdi.mdi-coin{
    font-size: 21px;
    position: absolute;
    left: 25px;
    color: #ff7575f7;
}
.mdi.mdi-comment-text-multiple-outline{
    font-size: 21px;
    position: absolute;
    left: 15px;
    color: #e5b53f;
}
.mdi.mdi-comment-text-multiple-outline.white-color{
	left: -10px;
	top: 20px;
}
.taskslist .mdi.mdi-comment-text-multiple-outline{
    font-size: 16px;
    position: absolute;
    left: 0;
    color: #e5b53f;
}
.no-license{
    width: 100%;
    height: 100%;
    flex: 1 1 0%;
    position: absolute;
    backdrop-filter: blur(2px);
    background: linear-gradient(white, 20%, transparent);
	z-index: 1;
	font-size: xx-large;
    color: #d06666;
    font-weight: 600;
    padding-top: 20%;
	display: none;
}
.blur-overlay-visible {
    display: block !important;
}
.pricecost_icon{
    position: relative;
}
.pricecost_icon .mdi.mdi-coin{
    font-size: 21px;
    position: absolute;
    left: 41px;
    top: 35px;
    color: #ff7575f7;
}
.mdi.mdi-content-save-outline{
    font-size: 23px;
}
.save-outline{
    padding: 0 10px;
}
.dataTables_paginate.paging_simple_numbers .paginate_button.current{
    background: #007bff;
    color: white!important;
}
.dataTables_paginate.paging_simple_numbers a.paginate_button{
    border: solid 1px #e4e7ea;
    color: #636e7b;
    padding: 6px 12px
}
.dataTables_paginate.paging_simple_numbers a.paginate_button:hover{
    color: #636e7b!important;
    background-color: #e4e7ea;
}

.dataTables_paginate.paging_simple_numbers a.paginate_button.current{
    background: #007bff!important;
    color: white!important;
}
.dataTables_paginate.paging_simple_numbers a.paginate_button{
    color: #636e7b;
    padding: 6px 12px!important;
    cursor: pointer;
}
.dataTables_paginate.paging_simple_numbers a.paginate_button:hover{
    color: #636e7b!important;
    background-color: #e4e7ea;
}
.notification-list .user-list{
    overflow-y: auto;
}

.fw-light {
    font-weight: 300!important;
}
#choosecombo{
    display: none;
    position: absolute;
    right: 19%;
    top: -23px;
}
#choosecombo_show{
    padding: 5px 35px 5px 5px;
    font-size: 16px;
    border: 1px solid #CCC;
    height: 34px;
    background: url(https://d3ki9tyy5l5ruj.cloudfront.net/obj/75e061d41609778396dbf9b085eec6ce158452ee/Number.svg) 96% / 10% no-repeat #EEE;
}
.my-4 {
    margin-top: 1.5rem!important;
    margin-bottom: 1.5rem!important;
}
.align-items-start {
    align-items: flex-start!important;
}

.d-flex {
    display: flex!important;
}
.c-flex {
    display: flex;
}
.me-3 {
    margin-left: 1rem!important;
}
.swal2-footer{
    flex-direction: row-reverse;
}

.div-table {
  display: table;         
  width: 100%;         
  background-color: #eee;                
  border-spacing: 1px; /* cellspacing:poor IE support for  this */
}
.resp-table-row div:nth-child(2) {
    direction: ltr;
    text-align: left;
}
.div-table-row {
  display: table-row;
  width: auto;
  clear: both;
}
.div-table-col {
  float: left; /* fix for  buggy browsers */
  display: table-column;         
  width: 200px;         
  background-color: #fff;  
}
#resp-table-caption{
display: table-caption;
text-align: center;
font-size: 30px;
font-weight: bold;
}
#resp-table-header{
display: table-header-group;
background-color: gray;
font-weight: bold;
}
.table-header-cell{
display: table-cell;
padding: 2px 10px;
text-align: justify;
background: #1979c3;
color: white;
}

#resp-table-body{
   display: table-row-group;
   background: white;
}
.resp-table-row{
    display: table-row;
}
.table-body-cell{
    display: table-cell;
    padding: 6px 12px;
}
.audio-row{
    vertical-align: middle;
    width: 30%;
}
.btn-light-primary {
    background-color: #ddd8fd;
    border-color: #c9c4e7;
    color: #7460ee!important;
    border-radius: 4px;
    font-weight: 600;
}

.btn-light-primary:hover {
    background-color: #7460ee;
    border-color: #7460ee;
    color: #fff!important;
}
.btn-light-secondary:hover {
    background-color: #9FA6B2;
    border-color: #9FA6B2;
    color: #fff!important;
}
.btn-light-info:hover {
    background-color: #137eff!important;
    border-color: #137eff!important;
    color: #fff!important;
}
.btn-light-success:hover {
    background-color: #5ac146;
    border-color: #5ac146;
    color: #fff!important;
}
.btn .badge {
    position: relative;
    top: -1px;
}
.ms-auto.bg-primary{
    width: 30px;
    height: 17px;
    padding: 3px 12px;
}
.btn-light-info {
    background-color: #137eff61!important;
    border-color: #137eff61;
    color: #137eff!important;
    border-radius: 4px;
    font-weight: 600;
}
.btn-light-secondary {
    background-color: #6c757d75;
    border-color: #6c757d75!important;
    color: #6c757d;
    border-radius: 4px;
    font-weight: 600;
}
.btn-light-success {
    background-color: #5ac14666;
    border-color: #5ac14666;
    color: #5ac146!important;
    border-radius: 4px;
    font-weight: 600;
}
.btn-light-history {
    background-color: #bdc7d1ba;
    border-color: #bdc7d1ba;
    color: #5ac146!important;
    border-radius: 4px;
    font-weight: 600;
}
.btn-light-history:hover{
    background-color: #435966;
    border-color: #435966;
    color: #5ac146!important;
    border-radius: 4px;
    font-weight: 600;
}
.btn-light-danger {
    background-color: #dc354557;
    border-color: #dc354557;
    color: #dc3545!important;
    border-radius: 4px;
    font-weight: 600;
}
.btn-light-danger:hover{
    background-color: #dc3545;
    border-color: #dc3545;
    color: #fff!important;
    border-radius: 4px;
    font-weight: 600;
}
.ms-auto.bg-danger{
    width: auto;
    height: auto;
    padding: 3px 12px;
    color: white;
    background-color: #5ac146!important;
    left: auto;
    top: 0px;
}
.ms-auto {
    margin-right: auto!important;
}
.ms-auto.bg-success{
    width: auto;
    height: auto;
    padding: 3px 12px;
    color: white;
    background-color: #5ac146!important;
    left: auto;
    top: 0px;
}
.ms-auto.bg-history{
    width: auto;
    height: auto;
    padding: 3px 12px;
    color: white;
    background-color: #435966!important;
    left: auto;
    top: 0px;
}
.ms-auto.bg-secondary{
    width: auto;
    height: auto;
    padding: 3px 12px;
    color: white;
    background-color: #6c757d!important;
    left: auto;
    top: 0px;
}
.ms-auto.bg-info{
    width: auto;
    height: auto;
    padding: 3px 12px;
    color: white;
    margin-bottom: 0;
    background-color: #137eff!important;
    left: auto;
    top: 0px;
}
.ms-auto.bg-primary{
    width: auto;
    height: auto;
    padding: 3px 12px;
    color: white;
    background-color: #7460ee!important;
    left: auto;
    top: 0px;
}

/*For file upload*/

.drop-container {
  border: 2px dashed #ccc;
  border-radius: 5px;
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin: 7px 20px;
  padding: 15px;
}

.drop-message {
  text-align: center;
  color: #5b69bc;
}

.drop-message i {
  font-size: 40px;
  margin-bottom: 10px;
}

.browse-btn {
  background-color: #4CAF50;
  color: white;
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 5px;
  margin-top: 10px;
}

.file-list {
  margin-top: 20px;
  margin-bottom: 20px;
}
.file-details{
    width: 40%;
}

.file-item {
  padding: 5px;
  background-color: #f2f2f2;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-bottom: 5px;
  margin: 5px 20px;
  position: relative;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}
#fileInput {
  position: absolute;
  bottom: 43px;
  left: 0;
  width: 100%;
  opacity: 0;
  cursor: pointer;
}
#fileInputsu {
  position: absolute;
  bottom: 43px;
  left: 0;
  width: 100%;
  opacity: 0;
  cursor: pointer;
}
.title-input-container{
    position: absolute;
    left: 10px;
    top: 5px;
    width: 57%;
    height: 43px;
}
.title-input{
    padding: 4px 10px;
    width: 87%;
}
.saveb{
    color: #286090;
    top: -5px;
    left: -12px;
    position: relative;
}
.showfolder{
    color: #5b69bc;
    cursor: pointer;
	font-size: 25px!important;
}
.title-input-container{
    display: block!important;
}
#add_notification .form-check-inline{
	float: left;
}
#Listfile {
  list-style: none;
  padding: 0;
  margin: 0;
}

#Listfile li {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}

#Listfile li:last-child {
  border-bottom: none;
}

#Listfile li i {
  font-size: 24px;
  margin-right: 10px;
  color: #007bff; /* You can change the color to your liking */
}

#Listfile li .file-info {
  flex: 1;
}

#Listfile li h3 {
  margin: 0;
  font-size: 18px;
  font-weight: bold;
}

#Listfile li p {
  margin: 5px 0 0 0;
}

#Listfile li p a {
  text-decoration: none;
  color: #007bff; /* You can change the color to your liking */
}

#fileList li p a:hover {
  text-decoration: underline;
}

@media (min-width: 992px){
    .col-lg-1-1 {
        -ms-flex: 0 0 5.333333%!important;
        flex: 0 0 5.333333%!important;
        max-width: 5.333333%!important;
        margin-top: 2px;
    }
    .col-lg-2-2 {
        -ms-flex: 0 0 10.333333%!important;
        flex: 0 0 10.333333%!important;
        max-width: 10.333333%!important;
    }
}

@media (max-width: 1185px){
    
    .firstnav{
        margin-bottom: 20px;
        font-size: 18px!important;
    }
    .firstnav a{
        font-size: 15px!important;
    }
    
    .w-100{
        font-size: 14px;
        text-align: right;
    }
	.w-50 {
		width: 100% !important;
	}
    #lblradio1{
        margin: 0 10px 0 0;
    }
    .btn-outline-primary {
       width: 233px;
    }
    .list-inline-item i {
      color: #fff;
    }
	#addincoming{
		
	}
}
@media (min-width: 768px) and (max-width: 825px) {
    .menucontext a{
        font-size: 18px;
        line-height: 32px;
    }
    #secnav {
        flex: 0 0 60%;
    }
    .secondnav{
        flex: 0 0 100%;
    }
    #secnav .btn-info:hover {
        width: 100%!important;
        max-width: 100%;
    }
    .rtl .w-100 {
        text-align: right;
        max-width: 100%;
    }
    
    .miniPBX .btn {
        padding: 0.2em 0.8em!important;
    }
    #edit-cond {
        margin-top: 30px;
    }
    .m-b-0 {
        margin-top: 15px!important;
        margin-right: 49%;
    }
	.w-50 {
		width: 100% !important;
	}
}
@media (max-width: 900px){
    /*.container {
         max-width: 93%!important; 
    }*/
    #get_Client_Licenses .pricecost_icon .mdi.mdi-coin {
        left: 9px;
        top: 25px;
    }
    #product_data_search th{
        width: 100%!important;
        float: right;
    }
    #massedit{
        margin: 0!important;
    }
    
    .accounting .form-group{
        width: 100%
    }
    .accounting .icon.glyphicon.input-group-addon.glyphicon-search{
        right: 249px!important;
    }
    .accounting .card-box.table-responsive{
        padding: 0!important;
    }
    .paidsum{
        top: 458px!important;
        left: auto!important;
    }
    .save-cond {
        float: left;
        width: 18%;
    }
    .miniPageTitle {
        margin-right: 10px;
    }
    .firstnav a{
        font-size: 14px!important;
    }
    .miniPBX .col-sm-2{
        top: 78px!important;
    }
    #secnav{
        max-height: 355px!important;
    }
    .list-group-item { 
        padding: 0.68rem 1.25rem;      
    }
    .list-inline-item i {
      color: #fff;
    }
    .w-100{
        font-size: 14px;
        text-align: right;
    }
    
    #lblradio1{
        margin: 0 10px 0 0;
    }
    .btn-group, .btn-group-vertical{
        width: 96%;
        margin: 0 10px 0 10px;
    }
    .btn-outline-primary{
        width: 33.3%;
    }
    .list-cond-des span {
        width: 32.3%!important;
        font-size: 12.5px;
    }
    .titlecon {
        margin-bottom: 20px;
        margin: 10px 15px;
    }
    .pricing-column .plan-stats li {
      margin-left: 0;
      width: 100%;
    }
    .mplan-stats{
        margin-top: 42px;
    }
    .edit-incoming{
        position: absolute;
        top: 0%;
    }
    .hide-phone {
        display: none !important;
    }
    .rtl .float-right, .rtl .pull-right, .rtl .close {
        float: right!important;
    }
    .col-md-2 span {
      font-size: 11px!important;
      font-weight: bold;
    }
	.status-number-med{
		font-size: 7em!important;
	}

    .draggable {
       touch-action: none;
       position: relative;
    }
    .wd-200{
        width: 100%!important;
        max-width: 230px;
    }
    .edit-conditions span{
        width: 97%!important;
    }
    
    .dragedit, .edit-incoming,.dragdrop-div{
        width: 98%;
    }
    .dragdrop-div{
        left: -11px;
        position: relative;
    }
    .ivrdragedit .dragdrop-div.drop-div{
        left: 0;
    }
    .drop.ivrKeysButtons {
        left: -8px;
        position: relative;
    }
    .ivrKeysButtons{
        
    }
    .ivrdragedit {
        width: 56%;
        left: -10px;
        position: relative;
    }
    .bigtableGrid{
        margin-top: 50px;
    }
    #search_button {
        margin-top: 64px;
    }
    #Call_Campaigns .dataTables_filter{
        float: right;
        margin-left: 0;
    }
    .rtl #responsive-datatable_wrapper .dataTables_length {
        left: 1%;
    }
	#addincoming{
		
	}
}
@media (max-width: 1200px){
    .col-md-2 span {
      font-size: 11px!important;
      font-weight: bold;
    }
	.status-number-med{
		font-size: 7em!important;
	}
	#addincoming{
		
	}
}
@media (max-width: 1400px){
	#addincoming{
		
	}
}
@media (max-width: 1600px){
	#addincoming{
		
	}
}
@media (min-width: 992px){
    .dropdown-menu-right {
        right: auto!important;
        left: auto!important;
    }
    #cdReport .btn-group, .btn-group-vertical {
        left: -169px;
    }
    .mdi {
        font-size: 25px;
    }
}
@media (min-width: 576px){
    .container {
        max-width: 100%!important;
    }
}

@media (min-width: 576px){
    .modal-dialog {
        margin: 16.75rem auto;
        /* margin-top: 100px; */
    }
    .accounting .modal-dialog {
        margin: 16.75rem auto;
        /* margin-top: 100px; */
    }
    #modalExt .modal-dialog{
       max-width: 300px;
       margin: 15rem auto;
    }
}
@media(min-width:1024px){
    .gallery a{ width:15%; float:left; margin-bottom:1%;}
    .gallery a:nth-child(6n-1){ margin-left:1%; margin-right:2%;}    
    .gallery a:nth-child(6n-2){ margin-left:1%; margin-right:1%;}    
    .gallery a:nth-child(6n-3){ margin-left:1%; margin-right:1%;}    
    .gallery a:nth-child(6n-4){ margin-left:1%; margin-right:1%;}   
    .gallery a:nth-child(6n-5){ margin-right:1%; }    
    .gallery-blocks a{ width:16.667%; float:left; }
    .gallery-blocks a strong{font-size:20px!important;}
	.container{margin-bottom:30px; display:block;max-width: 100%;margin: 26px auto;padding: 10px}
	.hours-form{
	float: right;
	width:65%;
	clear: both;
}

}  
@media(max-width:923px){
  .buttons-html5, .btn-secondary{
        font-size: 11px;
  }
  .rtl .buttons-html5, .rtl .btn-secondary{
        font-size: 13px;
  }
    .mfirstnav{
        width: 40%!important;
        flex: 0 0 40%;
    }
    .msecnav{
        width: 60%!important;
    }
    .w-50{
        width: 100%!important;
    }
    .w-60{
        width: 60px!important;
    }
    article.pricing-column{
        display: flex;
        flex-direction: column-reverse;
    }
    .pricing-column .plan-stats span {
    font-size: 1rem;
   }
	
 div.dt-buttons {
    margin-bottom: 10px;
 }
  .content-client{
	  padding: 7px!important;
  }
  
  .green{
	  width:100%!important;
	  margin-bottom:20px;
  }
  .top-navi{
	  width:100%!important;
  }
  .w-md {
    min-width: 89px;
	margin-top:7px;
}
.col-md-15 {
    -ms-flex: 0 0 50%;
    flex: 0 0 48%;
    max-width: 48%;
}
.nav-tabs > li {
    margin-bottom: 0;
    margin-left: 2%;
}
.tab-width {
    width: 100%;
    margin-left: 20px;
}
.seven-cols a {
    padding: 6px 10px 6px 5px!important;
    color: #141414!important;
}
.tab-content {
    padding: 20px 0 20px 0;
}
.nav-tabs {
    padding: 10px;
}
.topbar-custom .nav-link {
    line-height: 16px!important;
}
.topbar-main .logo img {
    height: 42px!important;
}
.topbar-custom {
    
}
#topnav .topbar-main .topbar-right-menu li {
    float: right;
}

.nav-user {
    padding: 0 0 !important;
}
#topnav .navbar-toggle .lines {
    padding-top: 0px;
}
#navigation {
    position: absolute;
    top: 54px;
    right: 0;
}
.col-2{
	width:12%;
	max-width:12%;
	display:contents;
}
.col-1 {
	width:12%;
	max-width:12%;
}

.col-sm-3{
	width:100%;
	display:contents;
}
.ltr{
	float:left;
}
.col-md-12.mginput{
	display: flex;
    flex-flow: column-reverse;
}
.dropdown.notification-list.opens .dropdown-menu.dropdown-menu-right {
    left: auto!important;
}
.dropdown-menu.dropdown-menu-right.profile-dropdown{ 
    left: auto!important;
}
}  
@media (min-width: 1681px) and (max-width: 1920px) {
    .tab-content .dt-buttons, div#datatable-buttons_info{
        left: -7.4%;
    }
}
@media (min-width: 1480px) and (max-width: 1680px) {
    .tab-content .dt-buttons, div#datatable-buttons_info{
        left: -8.5%;
    }
}

@media screen and (max-width: 768px) {
    #queue_data td:nth-child(4),
    #queue_data th:nth-child(4) {
        display: none; /* Hide less important columns */
    }
	.condition-row {
        flex-direction: column;
        align-items: stretch; /* Ensure elements take full width */
    }

    .condition-row > div {
        width: 100%;
        text-align: center; /* Center align elements on mobile */
    }

    .add-time, .remove-time, .add-day, .remove-day {
        width: 100%; /* Make buttons full width on mobile */
    }
}

@media screen and (max-width: 576px) {
    #queue_data td:nth-child(3),
    #queue_data th:nth-child(3) {
        display: none;
    }
}
	
@media (max-width: 768px) {
    .condition-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .condition-row label, .condition-row select, .delete-condition {
        margin-bottom: 10px;
    }

    .delete-condition {
        align-self: flex-end;
    }
	#addincoming{
		
	}
}