


/* here you can put your own css to customize and override the theme */

@font-face {
  font-family: El_Messiri-Regular;
  src: url(fonts_ar/El_Messiri/ElMessiri-Regular.ttf) format('truetype');
}

thead {
  background: #E1E5EC;
  color: #666;
}
.arabicfont *
{
  font-family: El_Messiri-Regular,Arial, Helvetica, sans-serif;
  font-size:12px;
  text-align: right !important;
}
.rtl
{
 direction: rtl;
 text-align: left;
}
.arabictd
{
  font-family: El_Messiri-Regular,Arial, Helvetica, sans-serif !important;

}
.arabictdnumber
{
  font-family: El_Messiri-Regular,Arial, Helvetica, sans-serif !important;
  font-size: 14px !important;
  padding: 10px 3px !important;
  white-space: nowrap;
}

.arabicfont .page-title
{
  font-family: El_Messiri-Regular,Arial, Helvetica, sans-serif !important;
}
.arabicfont .caption-subject
{
  font-family: El_Messiri-Regular,Arial, Helvetica, sans-serif !important;
  font-size: 12px;
}
.customgreenbg
{
color: #fff;
background: #26C281 !important;
}
.customyellowbg
{
color: #fff;
background: #C8D046 !important;
}
.customgreentxt
{

color: #26C281 !important;
}

.custompurplebg
{
color: #fff;
background: #8E44AD !important;
}
.arabicfont table td
{
 text-align: right;

}
.arabicfont table th
{
 text-align: left;
 direction:ltr !important;

}
.profile-info
{
  margin: 0px 20px 0px 20px !important;
}
.nowrapCell {
white-space: nowrap;
}
.QucikView
{

}

:host { ::ng-deep
.p-multiselect {
  background: #121212;
  border: 1px solid #383838;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
  border-radius: 3px;
}
.p-multiselect:not(.p-disabled):hover {
  border-color: #64B5F6;
}
.p-multiselect:not(.p-disabled).p-focus {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 1px #93cbf9;
  border-color: #64B5F6;
}
.p-multiselect .p-multiselect-label {
  padding: 0.5rem 0.5rem;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
}
.p-multiselect .p-multiselect-label.p-placeholder {
  color: rgba(255, 255, 255, 0.6);
}
.p-multiselect.p-multiselect-chip .p-multiselect-token {
  padding: 0.25rem 0.5rem;
  margin-right: 0.5rem;
  background: #383838;
  color: rgba(255, 255, 255, 0.87);
  border-radius: 16px;
}
.p-multiselect.p-multiselect-chip .p-multiselect-token .p-multiselect-token-icon {
  margin-left: 0.5rem;
}
.p-multiselect .p-multiselect-trigger {
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  width: 2.357rem;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.p-inputwrapper-filled.p-multiselect.p-multiselect-chip .p-multiselect-label {
  padding: 0.25rem 0.5rem;
}

.p-multiselect-clearable .p-multiselect-label-container {
  padding-right: 1.5rem;
}
.p-multiselect-clearable .p-multiselect-clear-icon {
  color: rgba(255, 255, 255, 0.6);
  right: 2.357rem;
}

.p-multiselect-panel {
  background: #1e1e1e;
  color: rgba(255, 255, 255, 0.87);
  border: 1px solid #383838;
  border-radius: 3px;
  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
}
.p-multiselect-panel .p-multiselect-header {
  padding: 0.5rem 1rem;
  border-bottom: 0 none;
  color: rgba(255, 255, 255, 0.87);
  background: #1e1e1e;
  margin: 0;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}
.p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-inputtext {
  padding-right: 1.5rem;
}
.p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-multiselect-filter-icon {
  right: 0.5rem;
  color: rgba(255, 255, 255, 0.6);
}
.p-multiselect-panel .p-multiselect-header .p-checkbox {
  margin-right: 0.5rem;
}
.p-multiselect-panel .p-multiselect-header .p-multiselect-close {
  margin-left: 0.5rem;
  width: 2rem;
  height: 2rem;
  color: rgba(255, 255, 255, 0.6);
  border: 0 none;
  background: transparent;
  border-radius: 50%;
  transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
}
.p-multiselect-panel .p-multiselect-header .p-multiselect-close:enabled:hover {
  color: rgba(255, 255, 255, 0.87);
  border-color: transparent;
  background: rgba(255, 255, 255, 0.03);
}
.p-multiselect-panel .p-multiselect-header .p-multiselect-close:focus-visible {
  outline: 0 none;
  outline-offset: 0;
  box-shadow: 0 0 0 1px #93cbf9;
}
.p-multiselect-panel .p-multiselect-items {
  padding: 0.5rem 0;
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item {
  margin: 0;
  padding: 0.5rem 1rem;
  border: 0 none;
  color: rgba(255, 255, 255, 0.87);
  background: transparent;
  transition: box-shadow 0.2s;
  border-radius: 0;
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight {
  color: rgba(255, 255, 255, 0.87);
  background: rgba(100, 181, 246, 0.16);
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight.p-focus {
  background: rgba(100, 181, 246, 0.24);
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item:not(.p-highlight):not(.p-disabled).p-focus {
  color: rgba(255, 255, 255, 0.87);
  background: rgba(255, 255, 255, 0.09);
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item:not(.p-highlight):not(.p-disabled):hover {
  color: rgba(255, 255, 255, 0.87);
  background: rgba(255, 255, 255, 0.03);
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
  margin-right: 0.5rem;
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
  margin: 0;
  padding: 0.75rem 1rem;
  color: rgba(255, 255, 255, 0.87);
  background: #1e1e1e;
  font-weight: 600;
}
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
  padding: 0.5rem 1rem;
  color: rgba(255, 255, 255, 0.87);
  background: transparent;
}

.p-input-filled .p-multiselect {
  background: #383838;
}
.p-input-filled .p-multiselect:not(.p-disabled):hover {
  background-color: #383838;
}
.p-input-filled .p-multiselect:not(.p-disabled).p-focus {
  background-color: #383838;
}

p-multiselect.ng-dirty.ng-invalid > .p-multiselect {
  border-color: #ef9a9a;
}

}