/*
--------------------------------------------------------------------
Welcome to the 'classic' theme template: For quick Estuary's interface customization, modify the colors below.
More advanced customization is available through CSS classes within this document.
--------------------------------------------------------------------
*/


:root {
/* sets the background color */
  --background-color: black;

/* set the color of all text and typically some borders*/
  --primary-color: rgba(255, 255, 255, 255);

/* sets the background color of buttons and other borders */
--secondary-color: rgb(102, 102, 102);

/* sets the color of things that appear temporarily */
  --transient-color: orange;
}

/*
--------------------------------------------------------------------
				advanced customization
--------------------------------------------------------------------
*/

/*styles the background */
.background {
    background-color: var(--background-color);
	  }

/*styles the code font*/
.code-font {
	  font-family: 'Helvetica';
	  font-size: 1em;
    text-shadow: 0 0 10px #333333;
	  }

/* styles other fonts (e.g. the header, menus and labels) */
.ui-font {
	font-family: 'Helvetica';
	font-size: 1em;
	}

/* styles the user-inteface buttons */
.ui-buttons {
  color:var(--primary-color);
  background-color: transparent;
  cursor:pointer;
}

.ui-buttons:hover {
  background-color: var(--secondary-color);
}
/* styles the dropdown */

.ui-dropdownMenus{
	background-color: transparent;

}

.ui-dropdownMenus:focus {
  background-color: var(--background-color) !important;
}

/* styles the input boxes */

.ui-inputMenus{
  background-color: transparent;
  width: 3em;
}

.ui-inputMenus::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.ui-inputMenus:focus {
  background-color: var(--background-color) !important;
}

/* styles the primary borders (e.g. from dropdown menus)*/
.primary-borders {
	border-radius: 5px;
    border: 1px solid var(--primary-color);
}

/*styles other borders (e.g. from ui buttons and sequencer buttons)  */
.other-borders {
    border-radius: 5px;
    border: 1px solid var(--secondary-color);
    }
