/*-----------------*/
/* Main Master CSS */
/*-----------------*/
/* THEMES STYLE SHEET */
/* DEFINE COLORS ONLY IN THIS STYLE SHEET */

.colorpopuppickertester {
     color: #CCCCCC; /*Dummy for getting color in CSS.  Click on color value, then Ctrl-space.*/
}

.mainPage {
     background-color: var(--mainpage_back_color);
     border-bottom-color: var(--mainpage_border_bottom_color);
}

.titlebar {
     background-color: var(--titlebar_back_color);
     border-color: var(--titlebar_back_color);
}

.appButtonBar {
     background-color: var(--appbuttonbar_back_color);
     border-top-color: var(--appbuttonbar_border_color);
     border-bottom-color: var(--appbuttonbar_border_color);
     border-left-color: var(--appbuttonbar_border_color);
     border-right-color: var(--appbuttonbar_border_color);
}

.footer {
     background-color: var(--footer_back_color);
     border-top-color: var(--footer_back_color);
}

.scrollFooter {
     background-color: var(--footer_back_color);
     border-top-color: var(--footer_border_color);
}

#mywidgets {
     color: var(--mediumHighlight_text_color);
}

input {
     border-color: var(--default_light_gray_border_color);
     accent-color: var(--accent_color);
}

     /*===============================================================================*/
     /*================ NEW Button styling as of 3/26/2024 SGY =======================*/
     /*===============================================================================*/

     input[type="button"] {
          background-color: var(--input_button_back_color );
          color: var(--input_button_text_color);
          border: none;
          height: var(--default_button_height, 23px);
          font-size: var(--default_button_font_size, 1.0em);
          border-radius: var(--default_button_radius, 3px);
     }

          input[type="button"]:hover {
               background-color: var(--input_button_hover_back_color);
               color: var(--input_button_hover_text_color);
               border-color: var(--input_button_hover_border_color);
          }


          input[type="button"]:focus-visible {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border-color: var(--button_hover_border_color);
          }

          input[type="button"]:disabled {
               /*               background-color: var(--button_disabled_back_color);*/
               color: var(--button_disabled_text_color);
               /*               border-color: var(--default_light_gray_border_color);*/
               cursor: not-allowed;
               pointer-events: none;
          }

          input[type="button"].noaccesskey {
               background-color: var(--input_button_back_color);
               color: var(--input_button_text_color);
               border: none;
               height: var(--default_button_height, 23px);
               font-size: var(--default_button_font_size, 1.0em);
               border-radius: var(--default_button_radius, 3px);
          }

               input[type="button"].noaccesskey:hover {
                    background-color: var(--input_button_hover_back_color);
                    color: var(--input_button_hover_text_color);
                    border-color: var(--input_button_hover_border_color);
               }

               input[type="button"].noaccesskey:focus-visible {
                    background-color: var(--button_hover_back_color);
                    color: var(--button_hover_text_color);
                    border-color: var(--button_hover_border_color);
               }

               input[type="button"].noaccesskey:disabled {
                    /*               background-color: var(--button_disabled_back_color);*/
                    color: var(--button_disabled_text_color);
                    /*               border-color: var(--default_light_gray_border_color);*/
                    cursor: not-allowed;
                    pointer-events: none;
               }


          input[type="button"].border {
               background-color: var(--lightNeutral_back_color); /*transparent;*/
               color: var(--button_text_color);
               border: 1px solid var(--mediumNeutral_border_color);
               height: var(--default_button_height, 23px);
               font-size: var(--default_button_font_size, 1.0em);
               border-radius: var(--default_button_radius, 3px);
          }

               input[type="button"].border:hover {
                    background-color: var(--input_button_hover_back_color);
                    color: var(--input_button_hover_text_color);
                    border: 1px solid;
                    border-color: var(--input_button_hover_border_color);
               }


               input[type="button"].border:focus-visible {
                    background-color: var(--button_hover_back_color);
                    color: var(--button_hover_text_color);
                    border-color: var(--button_hover_border_color);
               }

               input[type="button"].border:disabled {
                    color: var(--button_disabled_text_color);
                    cursor: not-allowed;
                    pointer-events: none;
               }

              input[type="button"].borderonly {
                background-color: transparent; /*var(--lightNeutral_back_color);*/ /*transparent;*/
                color: var(--button_text_color);
                border: 1px solid var(--darkNeutral_border_color);
                height: var(--default_button_height, 23px);
                font-size: var(--default_button_font_size, 1.0em);
                border-radius: var(--default_button_radius, 3px);
              }

                input[type="button"].borderonly:hover {
                  background-color: var(--input_button_hover_back_color);
                  color: var(--input_button_hover_text_color);
                  border: 1px solid;
                  border-color: var(--input_button_hover_border_color);
                }


                input[type="button"].borderonly:focus-visible {
                  background-color: var(--button_hover_back_color);
                  color: var(--button_hover_text_color);
                  border-color: var(--button_hover_border_color);
                }

                input[type="button"].borderonly:disabled {
                  color: var(--button_disabled_text_color);
                  cursor: not-allowed;
                  pointer-events: none;
                }

button {
     background-color: var(--button_back_color);
     color: var(--button_text_color);
     border: none;
     height: var(--default_button_height, 23px);
     font-size: var(--default_button_font_size, 1.0em);
     border-radius: var(--default_button_radius, 3px);
}

     button:hover {
          background-color: var(--button_hover_back_color);
          color: var(--button_hover_text_color);
          border-color: var(--button_hover_border_color);
     }

     button:focus-visible {
          background-color: var(--button_hover_back_color);
          color: var(--button_hover_text_color);
          border-color: var(--button_hover_border_color);
     }

     button:disabled {
          /*          background-color: var(--button_disabled_back_color);*/
          color: var(--button_disabled_text_color);
          /*          border-color: var(--button_disabled_border_color);*/
          cursor: not-allowed;
          pointer-events: none;
     }

     button.border {
          background-color: var(--lightNeutral_back_color); /*transparent;*/
          color: var(--button_text_color);
          border: 1px solid var(--mediumNeutral_border_color);
          height: var(--default_button_height, 23px);
          font-size: var(--default_button_font_size, 1.0em);
          border-radius: var(--default_button_radius, 3px);
     }

          button.border:hover {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border: 1px solid;
               border-color: var(--button_hover_border_color);
          }

          button.border:focus-visible {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border: 1px solid;
               border-color: var(--button_hover_border_color);
          }

          button.border:disabled {
               /*          background-color: var(--button_disabled_back_color);*/
               color: var(--button_disabled_text_color);
               /*          border-color: var(--button_disabled_border_color);*/
               cursor: not-allowed;
               pointer-events: none;
          }

          button.borderonly {
            background-color: transparent; /*var(--lightNeutral_back_color);*/ /*transparent;*/
            color: var(--button_text_color);
            border: 1px solid var(--darkNeutral_border_color);
            height: var(--default_button_height, 23px);
            font-size: var(--default_button_font_size, 1.0em);
            border-radius: var(--default_button_radius, 3px);
          }

          button.borderonly:hover {
            background-color: var(--button_hover_back_color);
            color: var(--button_hover_text_color);
            border: 1px solid;
            border-color: var(--button_hover_border_color);
          }

          button.borderonly:focus-visible {
            background-color: var(--button_hover_back_color);
            color: var(--button_hover_text_color);
            border: 1px solid;
            border-color: var(--button_hover_border_color);
          }

          button.borderonly:disabled {
            /*          background-color: var(--button_disabled_back_color);*/
            color: var(--button_disabled_text_color);
            /*          border-color: var(--button_disabled_border_color);*/
            cursor: not-allowed;
            pointer-events: none;
          }


     button.noborder {
          background-color: transparent;
          color: var(--button_text_color);
          border: none;
          height: var(--default_button_height, 23px);
          font-size: var(--default_button_font_size, 1.0em);
          border-radius: var(--default_button_radius, 3px);
     }

          button.noborder:hover {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border-color: var(--button_hover_border_color);
          }

          button.noborder:focus-visible {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border: 1px solid;
               border-color: var(--button_hover_border_color);
          }

          button.noborder:disabled {
               /*          background-color: var(--button_disabled_back_color);*/
               color: var(--button_disabled_text_color);
               /*          border-color: var(--button_disabled_border_color);*/
               cursor: not-allowed;
               pointer-events: none;
          }

     /*============================================================================================*/
     /*   App Button Bar Buttons      Default Height 25px, font-size 1.1em                         */
     /*============================================================================================*/

     .appButtonBar input[type="button"] {
          background-color: var(--input_button_back_color );
          color: var(--input_button_text_color);
          border: 1px solid var(--mediumHighlight_border_color);
          height: var(--default_appbuttonbar_button_height, 25px);
          font-size: var(--default_appbuttonbar_button_font_size, 1.0em);
          border-radius: var(--default_appbuttonbar_button_radius, 3px);
     }

          .appButtonBar input[type="button"]:hover {
               background-color: var(--input_button_hover_back_color);
               color: var(--input_button_hover_text_color);
               border-color: var(--input_button_hover_border_color);
          }


          .appButtonBar input[type="button"]:focus-visible {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border-color: var(--button_hover_border_color);
          }

          .appButtonBar input[type="button"]:disabled {
               /*               background-color: var(--button_disabled_back_color);*/
               color: var(--button_disabled_text_color);
               /*               border-color: var(--default_light_gray_border_color);*/
               cursor: not-allowed;
               pointer-events: none;
          }

      .appButtonBar input[type="button"].noaccesskey {
        background-color: var(--appbuttonbar_input_button_back_color);
        color: var(--appbuttonbar_input_button_text_color);
        border: 1px solid var(--mediumHighlight_border_color);
        height: var(--default_appbuttonbar_button_height, 23px);
        font-size: var(--default_appbuttonbar_button_font_size, 1.0em);
        border-radius: var(--default_appbuttonbar_button_radius, 3px);
      }

               .appButtonBar input[type="button"].noaccesskey:hover {
                    background-color: var(--appbuttonbar_input_button_hover_back_color);
                    color: var(--appbuttonbar_input_button_hover_text_color);
                    border-color: var(--appbuttonbar_input_button_hover_border_color);
               }

               .appButtonBar input[type="button"].noaccesskey:focus-visible {
                    background-color: var(--button_hover_back_color);
                    color: var(--button_hover_text_color);
                    border-color: var(--button_hover_border_color);
               }

               .appButtonBar input[type="button"].noaccesskey:disabled {
                    /*          background-color: var(--button_disabled_back_color);*/
                    color: var(--button_disabled_text_color);
                    /*          border-color: var(--button_disabled_border_color);*/
                    cursor: not-allowed;
                    pointer-events: none;
               }

.appButtonBar button {
  background-color: var(--button_back_color);
  color: var(--button_text_color);
  border: 1px solid var(--mediumHighlight_border_color);
  height: var(--default_appbuttonbar_button_height, 25px);
  font-size: var(--default_appbuttonbar_button_font_size, 1.0em);
  border-radius: var(--default_appbuttonbar_button_radius, 3px);
}

          .appButtonBar button:hover {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border-color: var(--button_hover_border_color);
          }

          .appButtonBar button:focus-visible {
               background-color: var(--button_hover_back_color);
               color: var(--button_hover_text_color);
               border-color: var(--button_hover_border_color);
          }

          .appButtonBar button:disabled {
               /*          background-color: var(--button_disabled_back_color);*/
               color: var(--button_disabled_text_color);
               /*          border-color: var(--button_disabled_border_color);*/
               cursor: not-allowed;
               pointer-events: none;
          }


/*Reset UI button height as it is bigger than Q and the Q button height value set above for input and button will make UI buttons too small
	DO NOT REMOVE, and DO NOT MOVE UP in this file!  SGY 01/26/2023
*/
.ui-button {
     height: 2.1em;
}