@import url("https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600&display=swap");

html {
  font-size: 94.5% !important;
  background-color: #17212f;
  scrollbar-width: thin;
  color: #f6f6f6;
}

:root {
  --surf-bg: rgba(100, 181, 246, 0.16);
  --surf-color: rgba(255, 255, 255, 0.87);
}


/*color title ecc */
.title,
strong,.label, .card, .box {
  color: #c1c9d5;
}

.subtitle, .card-header-title,.p-menuitem-text {
  color:#fff;
}

table th {color:rgba(255, 255, 255, 0.87) !important;}


b,
strong {
  color:#fff;
}

/*DPI MONITOR*/
/* 1.5 dpr */
@media (-webkit-min-device-pixel-ratio: 1.5) {
  html {
    font-size: 88% !important;
  }
  .container {
    width: 96% !important;
  }
  .container.is-fluid {
    width: 100% !important;
    /* padding-left: 0.7rem;
    padding-right: 0.7rem; */
  }
}

/* 2 dpr */
@media (-webkit-min-device-pixel-ratio: 2) {
  html {
    font-size: 87% !important;
  }
  .container {
    width: 100% !important;
  }
  .container.is-fluid {
    width: 100% !important;
  }
}

/*small device*/
@media screen and (max-width: 1023px) {
  html {
    font-size: 88% !important;
  }
  .container {
    width: 100% !important;
  }
  /* .container.is-fluid {
    margin: auto !important;
  } */
}

@media screen and (min-width: 1024px) {
  .container {
    max-width: 1117px;
  }
}

/*DPI MONITOR*/

.tabs ul {
  border-bottom-width: 1px;
  border-bottom-color: #304562;
  font-weight: 500;

}

.tabs a {
  border-bottom-color: #304562;
  background-color: #1f2d40;
  border-bottom-width: 2px;
  color: #fff;
  padding: .7em 1.2em;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;

}

.tabs a:hover {
  background-color: #1f2d40;
  border-bottom-color: var(--primary-400);
  border-bottom-width: 2px;
  color: #fff;

}


.tabs li.is-active a {
  border-bottom-color: var(--primary-400);
  color: #fff;
}

a {
  color: #fff;
  cursor: pointer;
  text-decoration: none;
}

a.filelink {
  color: #fff;
  font-weight: 600;
}
a.filelink:hover {
  color: #095c9c;
}

body {
  padding-left: 62px;
}

html,
body,
.button,
.p-button,
input,
select,
.p-inputtext,
table,
textarea,
.label,
.p-tabmenu, .tabs, .p-datatable-footer, .p-progressbar-label {
  font-family: "Source Sans Pro", "sans-serif" !important;
}

.p-sidebar-left .p-sidebar {
  width: 62px !important;
}

.aside {
  display: block;
  position: fixed;
  left: 0;
  z-index: 999;
  height: 100vh;
  padding: 0px;
  box-shadow: 12px 10px 13px 0px rgba(0,0,0,0.1);
  background: #1f2d40;
  overflow: auto;
  width: 62px !important;
  scrollbar-width: thin;
}

.aside .button {
  background-color: transparent;
  border: 0px;
  color: #ffffffe8;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.aside .button:hover,
.aside .button.active {
  background-color: #204669;
  border: 0px;
  color: #fff;
}

@media screen and (max-width: 1023px) {
  body {
    padding-left: 0px;
  }

  .container.is-fluid {
    padding-left: 19px;
    padding-right: 19px;
  }

  .mobileoverlay {
    background-color: rgba(10, 10, 10, 0.86);
    height: 100vh;
    width: 100%;
    z-index: 30;
    position: fixed;
    top: 0;
    left: 0;
  }
}

@media screen and (max-width: 768px) {
  .container.is-fluid {
    padding-left: 16px;
    padding-right: 16px;
  }
  .hero.is-bg-light .hero-body {
    padding: 2.2rem 1.5rem;
    padding-bottom: 3rem;
  }
}

.navbar.is-dark {
  /* background-color: #152744; */
  background-color: transparent;
}

.hero .navbar.is-dark {
  background-color: transparent;
}

.navbar.is-dark a.navbar-item:hover,
.navbar.is-dark a.navbar-link:hover {
  background-color: #283547 !important;
  color: #fff;
}

.navbar.is-dark a.navbar-item:focus {
  background-color: transparent !important;
}

.navbar.is-dark a,
.navbar.is-dark .button {
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.box,
.card,
.navbar {
  background-color: #1f2d40;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

.card-footer {
  border-top: 0;
}

.h-auto{
  height: auto !important;
}

/*card qeual*/
.card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.hauto {
  height: auto !important;
}

.card-header {
  box-shadow: none !important;
  font-weight: 600;
  border-bottom:1px solid #304562;
}

.title {
  line-height: 1.4;
}

/*table*/
.table thead td, .table thead th, .table td {
  border-width: 0 0 1px;
  border-color: #304562;
}

.p-datatable .p-datatable-tbody > tr > td {
  vertical-align: middle !important;
  white-space: nowrap !important;
}


.p-datatable .p-datatable-footer {
  padding: 1rem 1rem;
  font-weight: inherit !important;
}

.hero.is-primary {
  background:#17212f;
}

.hero.is-primary .title {
  color: #fff !important;
}

.py-7 {
  padding-top: 2.5rem !important;
  padding-bottom: 4.1rem !important;
}

.navbar.is-dark .navbar-burger {
  color: #fff;
  padding: 2rem;
  padding: 2rem 0rem 2rem 0rem;
}

body.has-navbar-fixed-top,
html.has-navbar-fixed-top {
  padding-top: 4rem;
}

.navbar .button {
  background-color: transparent;
}
/*navbar*/

::placeholder {
  color: #c1c9d5 !important;
  opacity: 1 !important;
}

:-ms-input-placeholder {
  color: #c1c9d5 !important;
}

::-ms-input-placeholder {
  color: #c1c9d5 !important;
}

.tag.is-csize, .tag.is-csize-small {
  font-size: 0.96rem;
  font-weight: 600;
  color: var(--surf-color);
  background-color: var(--surf-bg);
  height: 1.7rem !important;
}

.tag.is-csize-small {
  font-size: 0.91rem;
}

.tag:not(body).is-delete {
  margin-left: 1px;
  padding: 0;
  position: relative;
  width: 2em;
  height: 1.7rem !important;
  font-size: 0.96rem;
}

.tag:not(body).is-info.is-light {
  font-weight: 600;
}

.tag.badge,
.tag.buttonbage {
  background-color: #d9342b;
  color: #fff;
  font-weight: 600;
  border-radius: 20px;
}

.tag.badge {
  position: absolute;
  top: 6px;
  right: 49px;
  z-index: 99;
}
.buttonbage {
  position: absolute;
  top: 0px;
  right: -8px;
  z-index: 99;
}

.footer {
  background-color: transparent;
  text-align: center;
  padding: 6rem 1.5rem 1rem;
  color: #435773;
}

/*loading*/
.loading {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 99;
  background: hsla(0, 0%, 100%, 0.22);
}

.loadingfixed {
  position: fixed !important;
}

.loading .icon {
  position: relative;
  top: 47%;
  left: 47%;
}

.animate__faster2 {
  --animate-duration: 300ms;
}

/*select*/
/* .select:not(.is-multiple):not(.is-loading)::after {
  border: 0px;
  right: 1.125em;
  z-index: 4;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "";
  transform: rotate(0);
  top: 0.95rem;
} */
/*select*/


/*pagination links*/
.pagination-link.is-current {
  background: var(--surf-bg);
  border-color: transparent;
  color: var(--surf-color);
}

.pagination-link,
.pagination-next,
.pagination-previous {
  background: var(--surf-bg);
  color: var(--surf-color);
  border:0px;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.pagination-link:hover, .pagination-next:hover, .pagination-previous:hover {
  background-color: #205586;
  color: var(--surf-color);
}

/*utility*/
.fullw {
  max-width: 100%;
  width: 100%;
}

hr {
  height: 1px;
}

.help {
  font-size: 0.85rem;
}

.image.is-64x64 {
  height: 54px;
  width: 54px;
}

.image.is-4by1 {
  padding-top: 25.2222% !important;
}

.image.is-4by1 img,
.image.is-4by1 .has-ratio {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 100%;
}


.is-transparent {
  background-color: transparent !important;
}

.brandoc {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.2rem;
  margin-top: 1rem;
  object-fit: contain;
  width: 120px;
}

.centerimg {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.5rem;
  width: 150px;
}

.buttoncanc {
  position: absolute !important;
  top: 10px;
  right: 10px;
}

.is-errorinput input,
.is-errorinput textarea,
.is-errorinput select {
  border-color: #f14668 !important;
}

.label.is-errorinput {
  color: #f14668;
}

.is-circle {
  width: 9px;
  height: 9px;
  display: inline-block;
  background: #48c78e;
  border-radius: 50%;
}

.buttons.are-small .button:not(.is-normal):not(.is-medium):not(.is-large) {
  font-size: 0.9rem;
}

.button.is-info.is-inverted {
  color: hsl(0, 0%, 48%);
}

ul.listfull li {
  padding: 0.4rem 0;
  border-bottom: 1px solid transparent;
}


ul.listfull.isborder li {
  padding: 0.4rem 0;
  border-bottom: 1px solid #283e5eb2;
}

ul.listfull li span {
  float: right;
}

.w-100 {
  width: 100px;
}

.w-170 {
  width: 170px !important;
}

.tag.is-trasp {
  background-color: transparent !important;
  color: #fff;
}

.tag.is-teal {
  background-color: var(--teal-600);
  color: var(--teal-100);
}

.tag.is-red, .p-chip.is-red {
  background-color: var(--red-400);
  color:#000;
}

.tag.is-warning {
  background-color: var(--orange-300) !important;
  color:#000 !important;
}


.p-chip {
  font-weight: 600 !important;
  font-size: inherit !important;
}

.tag.is-blue {
  background-color: hsl(217.3, 91.8%, 90.4%) !important;
  color: hsl(217.3, 60.7%, 23.9%) !important;
}

.tag.is-blues {
  background-color: var(--blue-600) !important;
  color: var(--blue-100) !important;
}

.has-text-info {
  font-weight: 600;
}

/*p dialog*/
.p-component-overlay {
  padding: 0 1rem 0 1rem;
}
.p-dialog .p-dialog-content {
  padding: 0 1rem 2rem 1rem !important;
}

.smalldiv {
  display: flex;
  margin-left: auto;
}

.help {
  display: block;
  margin-top: 0.45rem;
}

.label:not(:last-child) {
  margin-bottom: 0.7em;
}

.ch {
  margin-right: 1rem;
  margin-bottom: 1.3rem;
}

.ch label {
  margin-left: 0.35rem;
  color: #fff;
}

.ch .p-checkbox-disabled + label {
  color: #6c757d !important;
  opacity: 0.6;
}

.stylech {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.is-rounded{
  border-radius: 50%;
}

.coloricon1 {
  background-color: var(--teal-600);
  color: var(--teal-100);
}

.coloricon2 {
  background-color: var(--cyan-600);
  color: var(--cyan-100);
}

.coloricon3 {
  background-color: var(--blue-600);
  color: var(--blue-100);
}


.table {
  background-color: transparent;
}

.p-dialog .p-dialog-header {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}


/*progressbar */
.p-progressbar .p-progressbar-value{
  font-weight: 600 !important;

}

.p-progressbar.bar-warning .p-progressbar-value {
  background-color: var(--orange-300) !important;
}

.p-progressbar.bar-teal .p-progressbar-value {
  background-color: var(--teal-300);
}
/*progressbar */

.p-avatar {
  background-color: var(--primary-800) !important;
color: var(--primary-200) !important;
}

.p-avatar img {
  object-fit: cover !important;
}

.p-avatar.p-avatar-xl.noimg {
  width: 3.4rem !important;
  height: 3.4rem !important;
}

.has-text-white-ter {
  color: #81afd0 !important;
}


.p-message {
  margin: 1rem 0;
  margin-top:0rem !important;
}


.p-blockui {background-color: #1f2d4066 !important;}


.sp-box {
  border:0px dotted #304562;
  padding:0.8rem;
}

.p-datatable-row-expansion {background-color: #182537 !important;} 
.p-rowgroup-header {background-color: #182537bb !important;} 

.sp-box .p-datatable-table tr,
.sp-box .p-datatable-table th,
.sp-box .p-datatable-footer {background-color: transparent !important;}

.sp-box .p-datatable .p-datatable-thead th {
  text-align: left;
  padding: 0.8rem 0.8rem;
}


.sp-box .p-datatable-footer {
  border:0px !important;
}


.card .statusbutton .p-button-secondary .p-button-label {
  color:#fff;
}

.text-word-wrap {
  white-space: normal;
  word-wrap: break-word;
  width: 190px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: -webkit-box;
}

.message {
  background-color: #304562;
}

.message-body{
  color:inherit !important;
  border-color: #3287a8;
  border-radius: 0px;
}


.p-multiselect-label {
  font-size: 90%;
}


.fc .fc-daygrid-day.fc-day-today {
  background-color: #2249684f !important;
}


.fc-toolbar-title {
  font-weight: 600;
  color:#fff;
  font-size:1.5rem !important;
  text-transform: capitalize;
}

.fc .fc-toolbar {
  padding-left: .75rem !important;
  padding-right: .75rem !important;
  padding-top: 1rem !important;
}

.fc-button {
  font-size:98% !important;
}

@media screen and (max-width: 1023px) {
.fc .fc-toolbar {
  flex-flow: column;
}
.fc-toolbar-chunk h2 {
  margin-bottom: 1rem !important;
}
}

.fc-event-main {
  font-weight: 600;
}

.fc-direction-ltr .fc-daygrid-event .fc-event-time {
  padding-right: 3px;
}

a.fc-col-header-cell-cushion:hover, .fc-daygrid-day-top a:hover  {
  color:#ffff;
}

.fc .fc-popover {
box-shadow: rgba(0, 0, 0, 0.16) -2px 3px 6px, rgba(0, 0, 0, 0.73) 0px -3px 18px !important;
}


.text-word-wrap-1 {
  white-space: normal;
  word-wrap: break-word;
  max-width: 80%;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  display: -webkit-box;
  text-align: right;
}


.super_faster {
  --animate-duration: 0.7s;
}

.has-tab-success {
 border-left:5px solid rgb(17, 161, 159);
 background: linear-gradient(90deg, rgba(10,86,92,0.40) 0%, rgb(28, 39, 56) 2%, rgba(31,45,64,1) 100%) !important;
}

.is-100{
  width: 80px !important;
}

.is-trasp{
  background-color: transparent !important;
}


.progress.is-primary {
  border-radius: 2px !important;
  width: 100%;
}

progress {
  background: #304562 !important;
}

progress::-moz-progress-bar {
  background: #304562 !important;
}

progress::-webkit-progress-bar {
  background: #304562 !important;
}

.progress.is-primary::-webkit-progress-value {
  background:linear-gradient(to right, #4280b6, #52aab3) !important;
}
.progress.is-primary::-moz-progress-bar {
  background:linear-gradient(to right, #4280b6, #52aab3) !important;
}

.progress.is-primary::-ms-fill {
  background:linear-gradient(to right, #4280b6, #52aab3) !important;
  border: none;
}


.table.is-borderless
  td, 
  th{
    border: 0
  }
