/* Direct stylesheet authoring is an advanced feature. Knowledge of CSS required.*/

.psc-x1 { transition: all .2s ease-in-out; }
.psc-x1:hover { transform: scale(1.5) !important;  z-index: 5;}


.psc-x2 { transition: all .2s ease-in-out; }
.psc-x2:hover { transform: scale(2) !important;  z-index: 5;}

.psc-x3 { transition: all .2s ease-in-out; }
.psc-x3:hover { transform: scale(3) !important;  z-index: 5;}

/* Set the styling for the Table component checkbox colour.*/
.ia_tableComponent[data-component="ia.display.table"] .ia_checkbox__checkedIcon {
    color: black;
}
.ia_tableComponent[data-component="ia.display.table"] .ia_checkbox__uncheckedIcon {
    color: black;
}

div[data-component="ia.input.fileupload"] .ia_button--primary {
    background-color: var(--neutral-30);
    border-style: None;
    color: black;
    border-radius:20px;
}


/* Help page styles */

.psc-background:hover { 
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	transition: box-shadow 0.9s ease-in-out;
}

.psc-background-none { 
	box-shadow: 0 0px 0px 0 , 0 0px 0px 0;
	transition: box-shadow 0.9s ease-in-out;
}

@keyframes fadeIn{
	0% { opacity: 0; }
	100% { opacity: 1; }
}

.psc-FadeInFast {
	animation: fadeIn 2s;
}

.psc-FadeInMedium {
	animation: fadeIn 4s;
}

.psc-Disconnects\/Device-Connected.ia_container--primary.coord-aspect-ratio.aspect-horizontal.view 
  .inner-container:has(svg path[d="M 0.01621377,0.01595147 H 25.93719 V 41.138171 H 0.01621377 Z"]:only-of-type) {
  flex: 0 0 12px !important;
}

.psc-Disconnects\/Device-Connected.ia_container--primary.coord-aspect-ratio.aspect-horizontal.view 
  .inner-container:has(
  svg[viewBox="-0.5 -0.5 27 42"] 
    path[d="m 13.785537,6.4238337 -7.0747349,-3.1261989 -0.985,1.7060701 6.2447349,4.563801 z"]
):has(
  svg[viewBox="-0.5 -0.5 27 42"]
    path[d="m 12.141737,10.447495 -5.3573679,5.578853 1.2662916,1.509108 6.4243953,-4.30722 z"]
) {
  flex: 0 0 16px !important;
}


.psc-FadeInSlow {
	animation: fadeIn 6s;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}

.psc-rotate {
  animation: rotation 2s infinite linear;
}