/* ============================================================
   MODIFIED 2026-09-10 (Claude): color palette modernized. Replaced
   the dated palette (seagreen, #0000a0 navy, #538b01 olive,
   #006400/#808000 dark green/olive, #4CAF50/#45a049 green,
   #f44336 red, dodgerblue, #0040FF) with the app-wide brand palette
   (teal/ink/muted/danger - see :root vars in saawebappcss.css).
   Done via a scripted find/replace across this and 8 other CSS
   files; original hex values were not preserved inline here due to
   volume - see session/git history for prior values if ever needed.
   NOTE: this stylesheet is no longer actually used - FirstPage.html
   was rewritten the same day and no longer references its classes
   (.dashwrapper/.dashbox/.fpform*). Left in place/still linked in
   case anything else ever references it; safe to remove later.
   ============================================================ */
/*FormCSS*/
.btnLogin{
    float: right;
    margin-top: 5%;
    border: none;
    border-radius: 1.5rem;
    padding: 2%;
    background: #0062cc;
    color: #fff;
    font-weight: 600;
	text-align:center;
	display:table-cell;
	vertical-align:middle;
	line-height:12px;
	
    width: 30%;
    cursor: pointer;
}
.fpformwrapper {
        display: grid;
		grid-gap: 1px;
        grid-template-columns: [col00-start] 1% [col1-start] 49%  [col2-start] 49%  [colnn-start] 1%;
        grid-template-rows: [rowlabel1-start] 20px [rowfield1-start] 40px [rowfiller01] 10px [rowlabel2-start] 20px 
					[rowfield2-start] 40px [rowfiller02] 10px [rowlabel3-start] 20px [rowfield3-start] 40px [rowfiller03] 10px 
					[rowlabel4-start] 20px [rowfield4-start] 40px [rowfiller04] 10px [rowlabel5-start] 20px [rowfield5-start] 40px 
					[rowfiller05] 10px [rowlabel6-start] 20px [rowfield6-start] 40px
					[rowfiller06] 10px [rowlabel7-start] 20px [rowfield7-start] 40px;
		grid-template-areas:
				'rowlabel1 rowlabel1 rowlabel1 rowlabel1'
				'rowfield1 rowfield1 rowfield1 rowfield1'
				'rowfiller01 rowfiller01 rowfiller01 rowfiller01'
				'rowlabel2 rowlabel2 rowlabel2 rowlabel2'
				'rowfield2 rowfield2 rowfield2 rowfield2'
				'rowfiller02 rowfiller02 rowfiller02 rowfiller02'
				'rowlabel3 rowlabel3 rowlabel3 rowlabel3'
				'rowfield3 rowfield3 rowfield3 rowfield3'
				'rowfiller02 rowfiller03 rowfiller03 rowfiller03'
				'rowlabel4 rowlabel4 rowlabel4 rowlabel4'
				'rowfield4 rowfield4 rowfield4 rowfield4'
				'rowfiller04 rowfiller04 rowfiller04 rowfiller04'
				'rowlabel5 rowlabel5 rowlabel5 rowlabel5'
				'rowfield5 rowfield5 rowfield5 rowfield5'
				'rowlabel6 rowlabel6 rowlabel6 rowlabel6'
				'rowfield6 rowfield6 rowfield6 rowfield6'
				'rowlabel7 rowlabel7 rowlabel7 rowlabel7'
				'rowfield7 rowfield7 rowfield7 rowfield7';
		grid-auto-rows: 1fr;
     /*    background-color: #fff;
        color: #444; */
		 /* border: 1px solid green;   */
    }
	.fpform input[type="password"] {
             display: block;
             margin : 0 auto;
			 height:35px;
        }
	.fpform input[type="text"] {
             display: block;
             margin : 0 auto;
			 height:35px;
        }
	.fpform input[type="submit"] {
             display: block;
             margin : 0 auto;
			 padding: 0 auto;
			 height:35px;
        }
	.fpform input[type=date]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    display: none;
	}
	.fpform input[type="date"]::-webkit-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}
    .fpformbox {
       /* background-color: blue;  */
        color: #fff; 
        border-radius: 5px;
        padding: 2px;
		text-align:left;
       /* font-size: 150%;*/
	   position:relative;
	    /* border: 1px solid green;  */
		
    }
	.fpformrow01Label01{
	   grid-column: col1-start;
        grid-row: rowlabel1-start ;
	}
	.fpformrow01Label02{
	   grid-column: col2-start;
        grid-row: rowlabel1-start ;
	}
	
	.fpformrow01Field01{
	   grid-column: col1-start;
        grid-row: rowfield1-start ;
	}
	.fpformrow01Field02{
	   grid-column: col2-start;
        grid-row: rowfield1-start ;
	}
	
	.fpformrow02Label01{
	   grid-column: col1-start;
        grid-row: rowlabel2-start ;
	}
	.fpformrow02Label02{
	   grid-column: col2-start;
        grid-row: rowlabel2-start ;
	}
	
	.fpformrow02Field01{
	   grid-column: col1-start;
        grid-row: rowfield2-start ;
	}
	.fpformrow02Field02{
	   grid-column: col2-start;
        grid-row: rowfield2-start ;
	}
	
	.fpformrow03Label01{
	   grid-column: col1-start;
        grid-row: rowlabel3-start ;
	}
	.fpformrow03Label02{
	   grid-column: col2-start;
        grid-row: rowlabel3-start ;
	}
	
	.fpformrow03Field01{
	   grid-column: col1-start;
        grid-row: rowfield3-start ;
	}
	.fpformrow03Field02{
	   grid-column: col2-start;
        grid-row: rowfield3-start ;
	}
	
	.fpformrow04Label01{
	   grid-column: col1-start;
        grid-row: rowlabel4-start ;
	}
	.fpformrow04Label02{
	   grid-column: col2-start;
        grid-row: rowlabel4-start ;
	}
	
	.fpformrow04Field01{
	   grid-column: col1-start;
        grid-row: rowfield4-start ;
		text-align: center;
		vertical-align: middle;
	}
	.fpformrow04Field02{
	   grid-column: col2-start;
        grid-row: rowfield4-start ;
	}
	
	.fpformrow05Label01{
	   grid-column: col1-start;
        grid-row: rowlabel5-start ;
	}
	.fpformrow05Label02{
	   grid-column: col2-start;
        grid-row: rowlabel5-start ;
	}
	
	.fpformrow05Field01{
	   grid-column: col1-start;
        grid-row: rowfield5-start ;
	}
	.fpformrow05Field02{
	   grid-column: col2-start/col4-start;
        grid-row: rowfield5-start ;
	}
	
	.fpformrow06Label01{
	   grid-column: col1-start;
        grid-row: rowlabel6-start ;
	}
	.fpformrow06Label02{
	   grid-column: col2-start;
        grid-row: rowlabel6-start ;
	}
	
	
	.fpformrow06Field01{
	   grid-column: col1-start/col3-start;
        grid-row: rowfield6-start ;
	}
	.fpformrow06Field02{
	   grid-column: col2-start;
        grid-row: rowfield6-start ;
	}

	.fpformrow07Label01{
	   grid-column: col1-start;
        grid-row: rowlabel7-start ;
	}
	.fpformrow07Label02{
	   grid-column: col2-start;
        grid-row: rowlabel7-start ;
	}

	.fpformrow07Field01{
	   grid-column: col1-start/col3-start;
        grid-row: rowfield7-start ;
	}
	.fpformrow07Field02{
	   grid-column: col2-start;
        grid-row: rowfield7-start ;
	}

/* Grid Layout */
/*FormCSSend*/
/*login/register*/
.col-300fp {
  float: left;
  width: 50%;
  margin-top: 6px;
  height:100%;
}

.register{
    background: -webkit-linear-gradient(left, #3931af, #00c6ff);
    margin-top: 3%;
    padding: 3%;
}
.register-left{
    text-align: center;
    color: #fff;
    margin-top: 4%;
}
.register-left input{
    border: none;
    border-radius: 1.5rem;
    padding: 2%;
    width: 100%;
    background: #f8f9fa;
    font-weight: bold;
    color: #383d41;
    margin-top: 10%;
    margin-bottom: 3%;
    cursor: pointer;
}
.register-right{
    background: #f8f9fa;
    border-top-left-radius: 10% 50%;
    border-bottom-left-radius: 10% 50%;
}
.register-left img{
    margin-top: 15%;
    margin-bottom: 5%;
    width: 25%;
    -webkit-animation: mover 2s infinite  alternate;
    animation: mover 1s infinite  alternate;
}
@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-20px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-20px); }
}
.register-left p{
    font-weight: lighter;
    padding: 8%;
    margin-top: 1%;
}
.register .register-form{
    padding: 5%;
    margin-top: 5%;
	height:auto;
}
.btnRegister{
    float: right;
    margin-top: 10%;
    border: none;
    border-radius: 1.5rem;
    padding: 2%;
    background: #0062cc;
    color: #fff;
    font-weight: 600;
    width: 50%;
    cursor: pointer;
}
.register .nav-tabs{
    margin-top: 3%;
    border: none;
    background: #0062cc;
    border-radius: 1.5rem;
    width: 28%;
    float: right;
}
.register .nav-tabs .nav-link{
    padding: 1%;
    height: 34px;
    font-weight: 600;
    color: #fff;
    border-top-right-radius: 1.5rem;
    border-bottom-right-radius: 1.5rem;
}
.register .nav-tabs .nav-link:hover{
    border: none;
}
.register .nav-tabs .nav-link.active{
    width: 100px;
    color: #0062cc;
    /* border: 2px solid #0062cc; */
    border-top-left-radius: 1.5rem;
    border-bottom-left-radius: 1.5rem;
}
.register-heading{
    text-align: center;
    margin-top: 2%;
    margin-bottom: -15%;
    color: #495057;
}
/*login/register end*/
#login .container #login-row #login-column #login-box {
  margin-top: 120px;
  max-width: 600px;
  height: 320px;
  border: 1px solid #9C9C9C;
  background-color: #EAEAEA;
}
#login .container #login-row #login-column #login-box #login-form {
  padding: 20px;
}
#login .container #login-row #login-column #login-box #login-form #register-link {
  margin-top: -85px;
}
img {
    max-width: 100%;
    max-height: 100%;
}
.dashwrapper {
        display: grid;
		grid-gap: 1px;
        grid-template-columns: [col0-start] 4% [col1-start] 15.33% [col2-start] 15.33%  [col3-start] 15.33%  [col4-start] 15.33% [col5-start] 15.33% [col6-start] 15.33% [col7-start] 4% [col7-end];
        grid-template-rows: [rowtop-start] 40px [row0-start] 40px [row1-start] 250px [row2-start] 250px [row3-start] 250px [row3-end];*/
		grid-template-areas:
				'rowtop rowtop rowtop rowtop rowtop rowtop rowtop'
				'row0 row0 row0 row0 row0  row0 row0'
				'row1 row1 row1 row1 row1  row1 row1'
				'row2 row2 row2 row2 row2  row2 row2'
				'rowfooter rowfooter rowfooter';
		grid-auto-rows: 2fr;
        background-color: #fff;
        color: #444; 
		margin-left:0px; 
    }

    .dashbox {
         /* background-color: lightgreen;   */
        /* color: black; /*fff; */ */
        border-radius: 5px;
        padding: 1px;
		text-align:middle;
       /*font-size: 150%;*/
	     /* border:1px solid black;  */
		/* font-size:calc((75vw - 4.5rem) / 70); */
		text-align: center;
		
    }
	
	.dashrowReportTitle{
	   grid-column: col1-start/col5-start;
        grid-row: row0-start ;
		font-size:24px;
	}
	.dashrowh1{
	   grid-column: col1-start;
        grid-row: row0-start ;
		
		/*background-color:#ABEBC6;*/
	}
	.dashrowh2{
	   grid-column: col2-start;
        grid-row: row0-start ;
		
		/*background-color:#ABEBC6;*/
	}
	.dashrowh3{
	   grid-column: col3-start;
        grid-row: row0-start ;
		/* background: -webkit-linear-gradient(left, #3931af, #00c6ff); */
		/*background-color:#ABEBC6;*/
	}
	.dashrowh4{
	   grid-column: col4-start;
        grid-row: row0-start ;
		/* background: -webkit-linear-gradient(left, #3931af, #00c6ff); */
		/*background-color:#ABEBC6;*/
	}
	.dashrowh5{
	   grid-column: col5-start;
        grid-row: row0-start ;
		/* background: -webkit-linear-gradient(left, #3931af, #00c6ff); */
		/*background-color:#ABEBC6;*/
	}
	.dashrowh6{
	   grid-column: col6-start;
        grid-row: row0-start ;
		/*background-color:#ABEBC6;*/
	}
	.dashaRightAd {
        grid-column: col6-start;
        grid-row: row1-start/row4-start ;
		/*background-color: #F5B7B1; /*#FF5733; */
    }
    .dashaLeftAd {
        grid-column: col1-start;
        grid-row: row1-start/row4-start ;
		/*background-color: #F5B7B1;/*#FF5733; */
    }
    .dashbImage {
        grid-column: col1-start/col3-start ;
        grid-row: row1-start/row4-start ;
    }
	  .dashc {
        grid-column: col3-start/col6-start ;
		grid-row: row1-start/row3-end;
		
		 /* border:1px solid lightgrey; */
		/* background-color: blue;  */
    }
	
    .dashd{
        grid-column: col2-start;
        grid-row: row2-start ;
    }
	.dashe{
        grid-column: col3-start;
        grid-row: row2-start ;
    }
	.dashf{
        grid-column: col2-start;
        grid-row: row3-start ;
    }
	.dashg{
        grid-column: col3-start;
        grid-row: row3-start ;
    }
	.dashh{
        grid-column: col4-start;
        grid-row: row3-start ;
    }
	.dashi{
        grid-column: col5-start;
        grid-row: row3-start ;
    }
	 .dashReportDate {
        grid-column: col4-start ;
		grid-row: row1-start;
		font-size:12px;
    }
	.dashReportTime{
        grid-column: col4-start;
        grid-row: row2-start ;
		font-size:12px;
    }
	.dashReportCriteria{
        grid-column: col1-start / col4-start;
        grid-row: row3-start ;
		font-size:18px;
		text-align:left;
    }

/* above is for flex box in dashboard */

body {
  font-size: .875rem;
}

.feather {
  width: 16px;
  height: 16px;
  vertical-align: text-bottom;
}

/*
 * Sidebar
 */

.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 100; /* Behind the navbar */
  padding: 48px 0 0; /* Height of navbar */
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}

.sidebar-sticky {
  position: relative;
  top: 0;
  height: calc(100vh - 48px);
  padding-top: .5rem;
  overflow-x: hidden;
  overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
  .sidebar-sticky {
    position: -webkit-sticky;
    position: sticky;
  }
}

.sidebar .nav-link {
  font-weight: 500;
  color: #333;
}

.sidebar .nav-link .feather {
  margin-right: 4px;
  color: #999;
}

.sidebar .nav-link.active {
  color: #007bff;
}

.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
  color: inherit;
}

.sidebar-heading {
  font-size: .75rem;
  text-transform: uppercase;
}

/*
 * Content
 */

[role="main"] {
  padding-top: 133px; /* Space for fixed navbar */
}

@media (min-width: 768px) {
  [role="main"] {
    padding-top: 48px; /* Space for fixed navbar */
  }
}

/*
 * Navbar
 */

.navbar-brand {
  padding-top: .75rem;
  padding-bottom: .75rem;
  font-size: 1rem;
  background-color: rgba(0, 0, 0, .25);
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25);
}

.navbar .form-control {
  padding: .75rem 1rem;
  border-width: 0;
  border-radius: 0;
}

.form-control-dark {
  color: #fff;
  background-color: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .1);
}

.form-control-dark:focus {
  border-color: transparent;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}
.dashbtn {
  border: 1px solid blue;
  width: auto;
  padding: 10px 18px;
  /* background-color: none; /* #0f8a8a; /*808000; /*006400 /*3CB371; /*4CAF50; */
  height:30px;
  text-align:center;
  display:table-cell; 
  vertical-align:middle;
  line-height:12px;
  margin:1px;
  white-space:normal;
  min-width:75px;
  -moz-outline:0 none;
   border-radius:49px; 
   background-color: white;
 }
/* table css for dashboard*/
.dashtable-scroll {
  position: relative;
  width: 100%;
  /* z-index: 1; */
  margin: auto;
  overflow: auto;
  height: 250px;
 border-radius: 15px;
}
.dashtable-scroll .selected, .dashtable-scroll tbody .selected
{
    background-color: #3CB371; /*27AE60;*/
    color: blue; /*lightgreen; /*fff;*/
}
.dashtable-scroll table {
  width: 100%; /* this is to control width of List on Tabular data */
  /* min-width: 1280px; */
  margin: auto;
  border-collapse: separate;
  border-spacing: 0;
  overflow-x:auto;
}

.dashtable-scroll th,
.dashtable-scroll td {
  padding: 5px 10px;
  border: 1px solid #000;
 /* background: #fff;*/
  vertical-align: top;
 
  /* width: 50px; */
  cursor:pointer;
}
.dashtable-scroll thead th {
  background: #0b6666; /*#0f8a8a; /*808000; /*006400; /*2E8B57; /*333;*/
  color: white; /*#fff;*/
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  
  /*background-image: linear-gradient(white, green);*/ /* use it if we need colors */
}
/* safari and ios need the tfoot itself to be position:sticky also */
.dashtable-scroll tfoot,
.dashtable-scroll tfoot th,
.dashtable-scroll tfoot td {
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  background: #666;
   z-index:4;
}
.dashtable-scroll tbody {
  /* display: block; /* to enable vertical scrolling */ */
  /* max-height: 200px; /* e.g. */ */
  overflow-y: auto; /* keeps the scrollbar even if it doesn't need it; display purpose */
}

/* .dashtable-scroll td:nth-child(2),.dashtable-scroll th:nth-child(2)  { 
position: -webkit-sticky;
position:sticky;
  left:140px;
  z-index:1;
  background-color:white; 
  
 }
 
.dashtable-scroll thead th:nth-child(2),
.dashtable-scroll tfoot th:nth-child(2) {
  z-index: 5;
}

.dashtable-scroll th:first-child {
  position: -webkit-sticky;
  position: sticky;
  left: 0;
  z-index: 2;
  background: white; 
}
.dashtable-scroll thead th:first-child,
.dashtable-scroll tfoot th:first-child {
  z-index: 5;
} */

/* ------------end of CSS for html header and first column */

/* TABLES CSS */
.dashdiv{
overflow: auto;
}