:root {
	--color1: #368ABF; /* rgb(54, 138, 191) */
	--color2: #63BBF2; /* rgb(99, 187, 242) */
	--color3: #03658C; /* rgb(3, 101, 140) */
	--color4: #66CAF2; /* rgb(102, 202, 242) */
	--color5: #0388A6; /* rgb(3, 136, 166) */
}

.tableDataDiv {
    display: flex;
    flex-direction: row;
}


.dataInTable td {
    padding: 0.25rem;
    
    border: none;
    
}

.dataInTable td input {
    border: none;
    font-size: smaller;
    padding: 0.2rem;
    border-radius: 0.2rem;
    text-align: center;
}


#cellTableDataIn_0 td input {
    pointer-events:none;
    color: var(--color3);
    font-weight: bold;
    text-align: left;
}

.dataInTableOddRow td input {
    background-color: aquamarine;
}

.dataInTableEvenRow td input {
    background-color: aqua;
}

.input-data-cell-table-container {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.dataOutTable td {
    padding: 0.25rem;
    font-size: smaller;
}

/*
#cellTableDataOut_0 {
    width: 100%;
}*/

#cellTableDataOut_0 td {
    color: var(--color3);
    font-weight: bold;
}

.output-data-cell-table-container{
    display: flex;
    flex-direction: row;
    justify-content: center;
}

#batteryTableDataOut_0 td {
    color: var(--color3);
    font-weight: bold;
}

.output-data-battery-table-container{
    display: flex;
    flex-direction: row;
    justify-content: center;
}

/* PARAMETERS PLOT: choose which parameters to plot */

.bar-plot-setup-cell fieldset {
    border: 1px solid gray;
    padding-left: 1rem;
    padding-bottom: 1rem;
}

.bar-plot-setup-cell fieldset legend{
    padding-top: 1rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}

.bar-plot-setup-cell fieldset legend span{
    text-transform: lowercase;
}

.bar-plot-setup-cell fieldset div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.bar-plot-setup-cell fieldset div div input {
    margin-left: 1rem;
    margin-right: 0.25rem;
}

/* VERSUS PLOT: cells */

.scatter-plot-setup-cell fieldset {
    border: 1px solid gray;
    padding-left: 1rem;
    padding-bottom: 1rem;
}

.scatter-plot-setup-cell fieldset legend{
    padding-top: 1rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}

.scatter-plot-setup-cell fieldset legend span{
    text-transform: lowercase;
}

.scatter-plot-setup-cell fieldset div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

/* VERSUS PLOT: battery pack */

.scatter-plot-setup-battery fieldset {
    border: 1px solid gray;
    padding-left: 1rem;
    padding-bottom: 1rem;
}

.scatter-plot-setup-battery fieldset legend{
    padding-top: 1rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}

.scatter-plot-setup-battery fieldset legend span{
    text-transform: lowercase;
}

.scatter-plot-setup-battery fieldset div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

/* Vehicle input data */

.battery-calculator-vehicle-data {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: space-evenly !important;
}

.battery-calculator-vehicle-data div div {
    margin-bottom: 0.5rem;
}

/* Charging input data */

.battery-calculator-charging-data {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: space-evenly !important;
}

.battery-calculator-charging-data div div {
    margin-bottom: 0.5rem;
}