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


.psc-samplestyle {
	min-width: calc(200%);
/*	background-color: red;*/
}


/*-----------Global Variables and Light + Dark Theme START-----------*/

/*.ia_powerChartComponent__timeAxis__values:nth-child(even) {*/
/*  transform: translate(0,10px);*/
/*}*/

/*.ia_timeAxis.ia_powerChartComponent__timeAxis__values:nth-child(even) {*/
/*	transform: translate(0,10px);*/
/*}*/

/*.tick:nth-child(even) {*/
/*	transform: translate(0,10px);*/
/*}*/
/*.ia_powerChartComponent__timeAxis__values > :nth-child(even) {*/
/*  transform: translate(0,10px);*/
/*}*/


.tick:nth-child(even) .ia_powerChartComponent__timeAxis__values {
  transform: translate(0,10px);
}

.psc-SamplePushButton {
	width: 75px;
	height: 63px;
	background-color: white;
	border-top-left-radius: 360px;
	border-bottom-left-radius: 360px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	position: relative;
	z-index: 1;
	-webkit-mask: radial-gradient(circle 57.5px at 35.5px 50%, transparent 27.5px, black 28px);
/*	-webkit-mask: radial-gradient(circle 27.5px at 27.5px 50%, transparent 27.5px, black 28px);*/
	mask: radial-gradient(circle 30px at 30px 50%, transparent 27.5px, black 28px);
}

.psc-GenericPushButton {
  position: relative;
  background-color: #C6C6C6;
  border-bottom-left-radius: 360px;
  z-index: 1;
  border-top-left-radius: 360px;
  border-bottom-right-radius: 0px;
  width: 75px;
  border-top-right-radius: 0px;
  height: 63px;
  mask: radial-gradient(circle 22px at 27px 50%, transparent 21px, black 20px);
}


.docked-view.docked-view-right {
	height: calc(100%-50px) !important;
/*	opacity: 0 !important;*/
}

* {
	font-family: Arial;
	transition: background-color 2.5s;
}

body {
	background-color: var(--rootBackgroundColor);
}

html:has(head link[href$="themes/light.css"]) body {
	--globalNavigationPrimaryColor: #03233E;
	--globalNavigationSecondaryColor: #DDE8F5;
	--rootBackgroundColor: #D6D6D6; /*#C3C3C3A*/
	--containerRoot: var(--rootBackgroundColor) !important;
	
	--tableEvenRows:#D2D7DB;
	--tableOddRows:#F3F7FC;
}

/*Dark Theme Global Variables*/
html:has(head link[href$="themes/dark.css"]) body {
	--globalNavigationPrimaryColor: #DDE8F5;
	--globalNavigationSecondaryColor: #345175;/*#03233E*/
	--rootBackgroundColor:#201F22;
	--containerRoot: var(--rootBackgroundColor) !important;
	--tableEvenRows:#3c5a7a;
	--tableOddRows:#2b3f5a;
}
:root {
	
	--highSidePipes: #DAA520;
	--lowSidePipes: #000080;
/*	--callToAction: var(--secondaryColor);*/
/*	--rootBackgroundColor:#c3c3c3;*/
}


/*#3f5d85#2e3f5a*/

/*---------------Global Variables and Light + Dark Theme END------------*/



/*------------COMPONENT OVERRIDES START-------------*/
/*Dropdown*/
.ia_dropdown__placeholder {
    font-style: italic;
}
.ia_dropdown--active, .ia_dropdown--focused {
    outline: none;
    box-shadow: 0px 0px 4px 4px var(--globalNavigationSecondaryColor);
}
.ia_dropdown__optionsModal {
    border-radius: 5px;
}

/*PowerChart*/
.ia_chartRow__background {
/*	fill: var(--rootBackgroundColor) !important;*/
	transition: fill 2.5s;
	opacity:0;
}

/*Pipe*/
.ia_pipeSegment{
    background-color:red;
    fill: purple;
    outline: dashed red;
}

.ia_dashboardComponent__widget__head {
    display: none !important;
}

/*Dashboard Widget*/
.ia_dashboardComponent__widget {
    border: none !important;
    border-radius: 0px !important;
}
.ia_dashboardComponent__widget__body {
    background-color: transparent;
    overflow: visible !important;
}
.ia_dashboardComponent__cell {
	background-color:var(--globalNavigationSecondaryColor);
}


/*------------COMPONENT OVERRIDES END-------------*/





/*------------SCROLLBAR OVERRIDE START-------------*/
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
    border: 3px solid #f1f1f1;
}

::-webkit-scrollbar-thumb:hover {
    background: #555555;
}
/*------------SCROLLBAR OVERRIDE END-------------*/




/*------------CUSTOM STYLE CLASSES START-------------*/
.psc-dropdownOverride:focus {
	outline: none !important;
}
.psc-dropdownOverride::placeholder {
	font-style: italic !important;
}


.psc-GlobalHeaderBorder::before {
  content: "";
  position: absolute;
  left: 48px; 
  bottom: 0;
  height: 2px; /* Full height of the container */
  width: calc(100% - 48px); /* Adjust width to exclude the 50px offset */
  border-bottom:  2px solid var(--globalNavigationSecondaryColor); /* Your desired border style */
}

.psc-NotesBorder::before {
  content: "";
  position: relative;
  top:0px;
  left: 6px; 
  height: 1px; 
  width: calc(100% - 12px);
  border-top:  1px solid;/*var(--globalNavigationSecondaryColor);*/
  border-top-color: var(--globalNavigationPrimaryColor);
}


.psc-MetaDataEditorForm:focus {
	box-shadow: 0px 0px 2px 2px var(--globalNavigationPrimaryColor);
}


.psc-HarmonicTable.ia_table__body__row--even {
    background-color: var(--tableEvenRows);
}

.psc-HarmonicTable.ia_table__body__row--odd {
    background-color: var(--tableOddRows);
}

/*.ia_dropdown--active, .ia_dropdown--focused {*/
/*    outline: none;*/
/*    box-shadow: 0px 0px 4px 4px var(--globalNavigationSecondaryColor);*/
/*}*/
/*popup-mobileNavMenu*/
#popup{
    border-radius: 20px;
    outline: none;
    border: none;
    animation-duration: .5s;
    animation-name: slideview;
}

.ia_popup{
	border-radius: 20px;
	outline: none;
	border: none;
	animation-duration: .5s;
	animation-name: slideview;
	overflow: hidden;
}

@keyframes slideview {
    0% {
        transform: scale(0);
        opacity: 0.0;       
    }
    60% {
        transform: scale(1.1);  
    }
    80% {
        transform: scale(0.9);
        opacity: 1; 
    }   
    100% {
        transform: scale(1);
        opacity: 1; 
    }       
}




.psc-metaDataEditorForm {
	height:200px;
	borderStyle: solid;
	display: grid;
	overflow: auto;
	backgroundColorOLD: var(--globalNavigationPrimaryColor);
	borderBottomLeftRadius: 8;
	borderBottomRightRadius: 8;
	borderTopLeftRadius: 8;
	borderTopRightRadius: 8;
	borderWidth: 0;
	gap: 5px;
	grid-template-areas: 
	  "CompanyName CompanyName SiteType SiteType DeviceID Utility Address Address"
	  "SiteName SiteName DisplayName DisplayName TapName Upstream Latitude Longitude"
	  "ErrorMessage ErrorMessage ErrorMessage ErrorMessage . . . Enabled";
	grid-template-columns: repeat(8,1fr);
	grid-template-rows: repeat(3,1fr);
	margin: 10px;
	padding: 8px;
}

@media (max-width:1336px) {
	.psc-metaDataEditorForm {
		height:300px;
		borderStyle: solid;
		display: grid;
		overflow: auto;
		backgroundColorOLD: var(--globalNavigationPrimaryColor);
		borderBottomLeftRadius: 8;
		borderBottomRightRadius: 8;
		borderTopLeftRadius: 8;
		borderTopRightRadius: 8;
		borderWidth: 0;
		gap: 5px;
		grid-template-areas: 
			"CompanyName CompanyName SiteType SiteType"
			"SiteName SiteName DisplayName DisplayName"
			"DeviceID Utility Address Address"
			"TapName Upstream Latitude Longitude"
			"ErrorMessage ErrorMessage . Enabled";
		grid-template-columns: repeat(4,1fr);
		grid-template-rows: repeat(5,1fr);
		margin: 10px;
		padding: 8px;
	}
}

/*------------CUSTOM STYLE CLASSES END-------------*/


.psc-HeartDefault {
	fill: var(--globalNavigationSecondaryColor) !important;
	transition: opacity 1s;
}
.psc-HeartFavorited {
	animation: pulse 2s ease 1 forwards;
	transform-origin: bottom center;
	transition: opacity 1s;
}


@keyframes pulse {
  0% { 
  	transform:scale(1.0) rotate(-5deg);
  	color:#564D4D;
  	}
  50% {
  	transform:scale(1.1) rotate(5deg);
/*  	color: #982626;*/
  }
  100% {
  	transform:scale(1.0) rotate(0deg);
  	color:#DB0000;
  }
}





.docked-view .docked-view-left .view {
	opacity: 0;
}


/* BEGIN STYLE CLASSES */
.psc-CloseLeftDock {
}

.psc-Fancy\/HeartPulse {
}

.psc-General\/Button {
  background-color: var(--globalNavigationPrimaryColor);
  color: var(--globalNavigationSecondaryColor);
  text-decoration: underline;
}

.psc-General\/Card {
  background-color: var(--globalNavigationSecondaryColor);
  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-General\/ContextMenu {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.psc-General\/Tooltip {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.psc-GlobalHeaderBorder {
}

.psc-HarmonicTable {
}

.psc-NotesBorder {
}

.psc-Overrides\/RemoveButtonHover {
  background-image: }.psc-Overrides\/RemoveButtonHover:hover {background-color: inherit !important;box-shadow: 0px 0px 0px !important;}{;
}

.psc-Overrides\/RoundedTable {
  background-image: }.psc-Overrides\/RoundedTable .table-container{border-radius:8px;}{;
  background-position: }.psc-Overrides\/RoundedTable {border-radius:8px;border-width:1px}{;
}

.psc-TestDock {
  background-image: }.psc-TestDock docked-view docked-view-right  dock-cover-shadow-right{height:calc(100%)}{;
}
