body,html
{
    font-family:"Inter",serif;
    font-optical-sizing: none;
    font-size:16px;
    background-color:white;
    height: 100%;
    margin: 0;
    padding: 0;
}
.fs-body
{
  font-size:16px;
}
.fs-title-1
{
  font-size: 20px;
}
.fs-title-2
{
  font-size: 18px;
}
.fs-title-3
{
  font-size: 16px;
}
.fs-body-small
{
  font-size: 14px;
}
.fs-body-xsmall
{
  font-size: 12px;
}
.fs-body-xxsmall
{
  font-size: 10px;
}
.fs-body-xxxsmall
{
  font-size: 8px;
}
.fs-body-exsmall
{
  font-size: 6px;
}

.custom-scrollbar
{
  overflow-y: auto;
}

.custom-scrollbar::-webkit-scrollbar 
{
  width: 7px; /* Width of the scrollbar */
  height: 7px;
}

.custom-scrollbar::-webkit-scrollbar-track
{
  background: #f0f0f0; /* Color of the track */
}

.custom-scrollbar::-webkit-scrollbar-thumb 
{
  background: #c3c3c3; /* Color of the thumb */
  border-radius: 6px; /* Rounded corners of the thumb */
}

.fixed-table-header
{
  position:sticky;
  top: 0px;
}

.custom-row {
  display: flex;
  gap:10px
}

.custom-col-1-5 {
  flex-basis: 12%;
  max-width: 12%;
}

.custom-col-rest {
  flex-basis: 88%;
  max-width: 88%;
}

.header-container
{
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  background-color: white;
}
.no-scrollbar
{
  overflow: hidden;
}

@media all and (max-width: 600px)
{
  .no-scrollbar
  {
    overflow:scroll;
  }
}

.img-border
{
  border: 1px;
  border-style:solid;
  border-radius: 7px;
  border-color:steelblue
}
.small-font
{
    font-size: x-small
}
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
   margin: auto;
    left: 20%;
    top: 1%;
    bottom: 1%;
    width: 60%; 
    height: 75%; 
    overflow: auto; /* Enable scroll if needed */
    background-color:rgb(250, 248, 248); /* Fallback color */
    /*background-color: rgba(0,0,0,0.4);*/ /* Black w/ opacity */
  
    border: 1px solid blue;
    padding: 5px;
    border-radius: 8px !important;
    /*background-color: #f8f9fa;*/
    box-shadow: 0px 0px 5px lightblue;
  }

 .confirm-modal
 {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1001; /* Sit on top */
    margin: auto;
    left: 50%;
    top: 50%;
    min-width:400px;
    max-width:70%;
    transform: translate(-50%, -50%);
    /*overflow: auto; /* Enable scroll if needed */
    background-color:rgb(250, 248, 248); /* Fallback color */
    border: 1px solid gray;
    padding: 5px;
    border-radius: 7px !important;
    box-shadow: 0px 0px 5px lightgray;
 }

 .confirm-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(182, 175, 175, 0.5);
  z-index: 1000;
  pointer-events: none; /* Block interaction by default */
  display: none; /*hidden by default*/
}

.confirm-modal-overlay.active {
    pointer-events: auto;
    display: block;
}

.swal-modal
{
  height:15%;
  width:300px;
  max-width:50%
}
  .swal-title
  {
    font-size:small;
    margin-bottom:50px
  }

  .swal-button
  {
    font-size:small;
  }

.menu-item-active
{
  /*background-color:rgb(225, 234, 246) !important;*/
  border-left:3px solid blue;*/
  border-radius: 0px !important;
}
.menu-item
{
  padding:2px !important;
}
.menu-item:hover,
.menu-item:focus,
.menu-item:focus-within
{
  background-color:rgb(200, 225, 243);
  border:0px solid blue;
  border-radius: 8px !important;
  
}

.straight
{
  border: 0px solid grey;
  padding: 5px;
  border-radius: 0px !important;
  /*background-color: #f8f9fa;*/
  box-shadow: 0px 0px 5px lightgray;
}

.rounded-sm 
{
  border: 0px solid darkgrey;
  padding: 5px;
  border-radius: 5px !important;
  /*background-color: #f8f9fa;*/
  box-shadow: 0px 0px 5px rgb(159, 159, 159);
}

.un-anchor:link {
    text-decoration:none !important;
}

/* visited link */
.un-anchor:visited {
    text-decoration:none !important;
}

/* mouse over link */
.un-anchor:hover {
    text-decoration:none !important;
}

/* selected link */
.un-anchor:active {
    text-decoration:none !important;
}

.custom-popover 
{
  --bs-popover-font-size:12px
}

.custom-tooltip {
    /*--bs-tooltip-bg: var(--bd-gray-bg);*/
    /*--bs-tooltip-color: var(--bs-primary);*/
    --bs-tooltip-color: blue;
    --bs-tooltip-bg: lightgrey;
  }

  .dashboard-cell
  {
    border: 1px solid rgb(184, 206, 244);
    padding: 10px;
    border-radius: 5px !important;
    /*background-color: rgb(240, 240, 240);/*#fdffff;*/
    box-shadow: 0px 0px 5px lightgray;
    margin-left: 10px !important;
  }

  .bg-color-chart
{
  background-color: rgba(250, 255, 255, 0.789);
}

.table-warning /* Overriding Bootstrap color */
{
  background-color: yellow !important;
}

.loading-bar
{
  width:30%;
  height:3px;
  background-color: darkcyan; 
  animation-name: loading;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  margin-top: 3;
  position: relative;
  
}

.image-container img {
  transition: transform 0.3s ease-in-out;
}

.image-container img:hover {
  transform: scale(1.5);
}

@keyframes loading 
{ 
  0% 
  { 
      left: 0; 
  }

  100% 
  { 
      left: 70%; 
  } 

  0% 
  { 
      left: 0; 
  } 
}