/* BEGIN STYLESHEET */


/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbarXXX {
  visibility: hidden; /* Hidden by default. Visible on click */
  min-width: 250px; /* Set a default minimum width */
  margin-left: -125px; /* Divide value of min-width by 2 */
  background-color: #911515; 
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 5px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: absolute; /* Sit on top of the screen */
  z-index: 1; /* Add a z-index if needed */
  left: 50%; /* Center the snackbar */
  bottom: 30px; /* 30px from the bottom */
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}


/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbarXXX.show {
  visibility: visible; /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}
/* BEGIN STYLE CLASSES */
.psc-Buttons\/ButtonDefault {
  background-color: #AC0000;
  color: #FFFFFF;
  cursor: pointer;
}
.psc-Buttons\/ButtonDefault:hover {
  background-color: #D90000;
  color: #2B2B2B;
  cursor: pointer;
}
.psc-Buttons\/ButtonDefault:disabled {
  background-color: #D5D5D5;
  color: #AAAAAA;
  cursor: not-allowed;
}

.psc-Buttons\/ButtonDelete {
  background-color: #AC0000;
  color: #FFFFFF;
}
.psc-Buttons\/ButtonDelete:hover {
  background-color: #D90000;
  color: #FFFFFF;
}
.psc-Buttons\/ButtonDelete:disabled {
  background-color: #D5D5D5;
  color: #AAAAAA;
}

.psc-Buttons\/HoverEmpty {
}
.psc-Buttons\/HoverEmpty:hover {
  cursor: pointer;
}

.psc-Colors\/Dark {
  background-color: #E1E1E1;
}

.psc-Colors\/Light {
  background-color: #FFFFFF;
}

.psc-Common\/Selected {
  background-color: #A0CDA3;
}

.psc-Components\/Labels\/Normal {
  color: #2B2B2B;
  font-size: 12px;
  font-weight: normal;
}

.psc-Components\/Labels\/SmallBold {
  color: #2B2B2B;
  font-size: 12px;
  font-weight: bold;
}

.psc-Components\/h2 {
  background-color: #D5D5D5;
  font-weight: bold;
  text-align: center;
}

.psc-Containers\/Body {
  background-color: #FFFFFF;
  border-bottom-color: #DFDFDF;
  border-bottom-style: solid;
  border-bottom-width: 0.5px;
  border-left-color: #DFDFDF;
  border-left-style: solid;
  border-left-width: 0.5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  border-right-color: #DFDFDF;
  border-right-style: solid;
  border-right-width: 0.5px;
  border-top-style: none;
}

.psc-Containers\/Header {
  background-color: #F4F4F4;
  border-color: #DFDFDF;
  border-style: solid;
  border-width: 1px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  font-weight: bold;
  padding-left: 10px;
}

.psc-Containers\/Margin {
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10px;
}

.psc-Global\/Components\/Buttons\/Selected {
  background-color: #EBF2FF;
  color: #3A66E6;
}

.psc-Global\/Components\/Containers\/StatusCard {
  background-color: #F7F8F9;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.psc-Global\/Components\/Containers\/TaskCard {
  background-color: #FFFFFF;
  border-color: #D9DCE2;
  border-style: solid;
  border-width: 1px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.psc-Global\/Components\/Containers\/TaskCard:hover {
  background-color: #F1F2F4;
  cursor: pointer;
}

.psc-Global\/Components\/Labels\/Normal {
  color: #2B2B2B;
  font-size: 12px;
  font-weight: normal;
}

.psc-Global\/Components\/Labels\/SmallBold {
  color: #2B2B2B;
  font-size: 12px;
  font-weight: bold;
}

.psc-Global\/Components\/Misc\/Hover {
}
.psc-Global\/Components\/Misc\/Hover:hover {
  background-color: #F1F2F4;
}

.psc-Global\/Components\/h2 {
  background-color: #D5D5D5;
  font-weight: bold;
  text-align: center;
}

@keyframes psc-Common\/PulseAlert-anim {
  0% {
    background-color: #AC0000;
    color: #FFFFFF;
  }
  100% {
    background-color: #FF8A8A;
    color: #000000;
  }
}
.psc-Common\/PulseAlert {
  animation-name: psc-Common\/PulseAlert-anim;
  animation-delay: 0s;
  animation-direction: alternate;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes psc-Components\/Labels\/Attention-anim {
  0% {
    color: #AC0000;
  }
  100% {
    color: #FF8A8A;
  }
}
.psc-Components\/Labels\/Attention {
  animation-name: psc-Components\/Labels\/Attention-anim;
  animation-delay: 0s;
  animation-direction: alternate;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes psc-Global\/Components\/Labels\/Attention-anim {
  0% {
    color: #AC0000;
  }
  100% {
    color: #FF8A8A;
  }
}
.psc-Global\/Components\/Labels\/Attention {
  animation-name: psc-Global\/Components\/Labels\/Attention-anim;
  animation-delay: 0s;
  animation-direction: alternate;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes psc-test-anim {
  0% {
    background-color: #DFC34E;
    background-position: linear-gradient(90deg,var(--byes-bg-menu) 0% 90%,  var(--byes-bg-menu) 90.00% 92.00%,  var(--byes-defautCom) 92.00% 94.00%,  var(--byes-bg-menu) 94.00% 96.00%,  var(--byes-bg-menu) 96.00% 98.00%,  var(--byes-bg-menu) 98.00% 100.00%);
    border-style: dotted;
    border-width: 1px;
    color: #D800FF;
    font-size: 8px;
    font-weight: bold;
    letter-spacing: 2;
    padding-left: 0px;
    fill: #BF7373;
  }
  100% {
    background-position: linear-gradient(90deg,var(--byes-bg-menu) 0% 90%,  var(--byes-bg-menu) 90.00% 92.00%,  var(--byes-defautCom) 92.00% 94.00%,  var(--byes-bg-menu) 94.00% 96.00%,  var(--byes-bg-menu) 96.00% 98.00%,  var(--byes-bg-menu) 98.00% 100.00%);
    border-style: solid;
    border-width: 2px;
    color: #F2B705;
    font-size: 14px;
    letter-spacing: 10;
    padding-left: 20px;
  }
}
.psc-test {
  animation-name: psc-test-anim;
  animation-delay: 0s;
  animation-direction: alternate-reverse;
  animation-duration: 1s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
