/* =================================================================================================================== */
/* PVT style */
/* =================================================================================================================== */


.sidebar {
  width: 25%;
  height: 100vh;
  background: #FFBF69;
  padding: 1vh 1vw;
  display: flex; 
  flex-flow: column nowrap;
}

.sidebar_header {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  gap: 0;
  padding: 5px 0 5px 0;
  
}

p {
  font-size: 14px;
  align-self: flex-start;
}

.sidebar_label {
  font-size: 14px;
}

.unitChange_btn {
  background-color: #dfdfdf;
  border-style: none;
  padding: 2px;
  width: 50%;
  height: 30px;
  cursor: pointer;
  font-size: 14px;
  align-self: flex-end;
  margin-left: auto;
}

.table {
  margin: 12px 0 0 0;
  font-size: 14px;
  font-weight: normal;
}

.table td:nth-child(1) {
  width: 5vw;
  padding: 0 20px 0 0;
}

.table td:nth-child(3) {
  width: 4.5vw;
  text-align: center;
}

.table tr td{
  /* border-bottom: 2px solid #FF950A; */
  border-style: none none solid none;
  border-color: #dfdfdf;
  vertical-align: middle;
  padding: 5px 0 5px 5px;
  font-size: 14px;
}

.table_input {
  width: 100%;
  padding: 5px;
  text-align: center;
  font-size: 14px;
  border-style: solid;
  border-width: 1px;
  border-color: #dfdfdf;
  outline: none;
}

.table_input::-webkit-inner-spin-button, 
.table_input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.unit {
  font-size: 14px;
}

.btn_container {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  gap: 1vw;
}

.button {
  background-color: #dfdfdf;
  border-style: none;
  padding: 2px;
  width: 50%;
  height: 30px;
  font-size: 14px;
  cursor: pointer;
}

/* .container_content{
  width: 75%;
  height: 100vh;
  background: #FFBF69;
  padding: 1vh 1vw;
} */

/* .row_content{
  height: calc(100% / 3);
} */

/* .col_content{
  height: 100%;
} */

/* .col_content_outer{
  height: 100%;
  width: 100%;
  background: #fff;
  border-radius: 15px;
  border: 2px solid #FFBF69;
} */

/* .chartContainer {
  height: 100%;
  width: 100%;
}

#chartContainer9 {
  background-color: #FFBF69;
} */









/* =================================================================================================================== */
/* SIDENAV MAIN */
/* =================================================================================================================== */

#sidebar_main {
  background-color: #7D0A0A;
  float:left;
  height: 100vh;
  width: 150px;
}

#sidebar_main_content {
  margin:20px 0 0 0;
}

#sidebar_main_toggle_button:hover {
  cursor: pointer;
}

#sidebar_main_toggle_div {
  padding:15px 15px 0 15px;
  text-align: right;
}

#sidebar_main_toggle_img {
  height:25px;
}

.sidebar_main_logo {
  padding: 0 0 30px 0;
  text-align: center;
}

#logo {
  height: 75px;
}

.sidebar_main_buttons_container {
  display: block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.sidebar_main_buttons {
  display: block;
  position: relative;
  padding: 7px 10px;
  cursor: pointer;
  font-size: 14px;
  color: White;
  font-family:Helvetica;
}

.sidebar_main_buttons_container input {
  position: absolute;
  opacity: 0;
}

.sidebar_main_buttons:hover {
  background-color: #a10d0d;
  color:white
}

.sidebar_main_buttons_active {
  background-color: #590707;
  color:white
}

.sidebar_main_buttons_container input:checked ~ .sidebar_main_buttons {
  background-color: #590707;
  color:white
}

#expandButtonIconR1C1 {
  height: 50px !important;
}


/* =================================================================================================================== */
/* WELLS SELECTOR */
/* =================================================================================================================== */

.well_nav_title {
  font-family: arial;
  font-size: 15px;
  font-weight: bold;
  height:30px;
  border-style:none none solid none;
  border-width:0.5px;
  border-color:#ddd;
  padding:4px 0 0 0;
}

.well_nav_title_secondary {
  font-family: arial;
  font-size: 15px;
  font-weight: bold;
  height:30px;
  border-style:none none nonde none;
  border-width:0.5px;
  border-color:#ddd;
  padding:4px 0 0 0;
}

.well_nav_bar {
  border-style:none none solid none;
  border-width:0.5px;
  border-color:#ddd;
  width:100%;
  text-align:center;
  height: 30px;
}

.well_nav_btn {
  background-color:#ffffff;
  display:inline-block;
  width:48%;
  height:29px;
  text-align:center;
  /*border-radius: 7px;*/
}

.well_nav_btn:hover {
  background-color:#f2f2f2;
}

.well_nav_btn_left {
  float:left;
}

.well_nav_btn_right {
  float:right;
}

.well_nav_btn_container {
  display:inline-block;
  cursor: pointer;
  text-decoration: none;
  color:black;
  height:28px;
  width:100%;
}

.well_nav_btn_container:hover {
  display:inline-block;
  cursor: pointer;
  text-decoration: none;
  color:black;
}

.well_nav_btn_inner {
  display:inline-block;
  height:28px;
  padding:3px 0 0 0;
}


.sidebar_well_selector_main {
  border-style:none none solid none;
  border-width:0.5px;
  border-color:#ddd;
  /*border-radius: 7px;*/
  padding:0;
  height:100%;
}

.sidebar_well_selector_inner {
  overflow:auto;
  height:100%;
}

.sidebar_well_selector_container {
  display: block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-style:none none solid none;
  border-width:0.5px;
  border-color:#ddd;
}

.sidebar_well_selector {
  display: block;
  position: relative;
  padding: 5px;
  cursor: pointer;
  font-size: 12px;
  color: black;
  font-family:Helvetica;
  /*border-style:none none solid none;
  border-width:0.5px;
  border-color:#ddd;*/
}

.colored_line {
  background-color: #f0f0f0;
}

.sidebar_well_selector:hover {
  cursor:pointer;
  background-color: #ddd;
}

.selected_well_line {
  background-color: #fcd9d9;
}

/*
.sidebar_well_selector_container input:checked ~ .sidebar_well_selector {
  background-color: #ddd;
  color:black;
}
*/

.well_navigator_tabs {
  height: 100%;
  padding: 0 2px 3px 2px;
  font-size: 14px;
}

.well_navigator_tabs:hover {
  cursor:pointer;
}

.well_navigator_tabs_selected {
  border-style:none none solid none;
  border-width:3px;
  border-color:#a10d0d;
}

.well_navigator_tabs_unselected {
  border-style:none none solid none;
  border-width:3px;
  border-color:transparent;
  color: #bdbdbd;
}


#bottom_left_panel_wells {
  height: calc(100% - 30px);
}

.bottom_left_panel_operators {
  height: calc(100% - 30px);
}

.model_buttons_containers {
  height: 100%;
}

.sidebar_operator_container {
  height: calc(100% - 30px);
  padding:10px 0 0 0;
}


/* =================================================================================================================== */
/* Models buttons */
/* =================================================================================================================== */


.models_buttons {
  border-style: solid;
  border-width: 0.5px;
  border-color:#7D0A0A;
  border-radius: 3px;
  background-color: #7D0A0A;
  color: white;
}


/* =================================================================================================================== */
/* INNER WORKINGS OF DASHBOARD CELLS */
/* =================================================================================================================== */

.dashboard_cell_outer_title {
  background-color: #efefef;
  padding:10px 10px 0 10px;
  height:100%;
  width:100%;
}


.dashboard_cell_outer {
  background-color: #efefef;
  padding:2px !important;
  height:100%;
  overflow: hidden;
}

.dashboard_cell_inner {
  background-color: #ffffff;
  /*border-style: solid;
  border-width:1px;
  border-color:#d6d6d6;*/
  height:100%;
  width:100%;
  padding: 3px 7px 7px 7px;
  overflow: hidden;
}

.dashboard_cell_inner_map {
  background-color: #ffffff;
  /*border-style: solid;
  border-width:1px;
  border-color:#d6d6d6;*/
  height:100%;
  width:100%;
}


/* =================================================================================================================== */
/* TITLE BAR */
/* =================================================================================================================== */

#title_bar {
  background-color: #efefef;
  height: 100px;
  width:100%;
  padding:0 0 0 230px;
}


/* =================================================================================================================== */
/* MAP */
/* =================================================================================================================== */

#map {
  /*position:relative;*/
  height:100%;
  width:100%;
}


/* =================================================================================================================== */
/* AUXILIARY CLASSES FOR UX */
/* =================================================================================================================== */

.hideElement {
  display: none;
}

.expandRow {
  height:100%;
}

.collapseRow {
  display: none;
  height:0%;
}


/* =================================================================================================================== */
/* DASHBOARD */
/* =================================================================================================================== */

.dashboard_container_landing {
  height:100vh;
  background-color: #efefef;
}

.dashboard_row_landing {
  height:100%;
  
}

.dashboard_container {
  height:calc(100vh - 100px);
  background-color: #efefef;
}

.main_row {
  height:100%;
  padding:2px !important;
}

.dashboard_row_100 {
  height:100%;
  
}

.dashboard_row_50 {
  height:50%;
  
}

.dashboard_row_33 {
  height:calc(100% / 3);
  
}

.dashboard_row_0 {
  height:0;
  
}

.plot_title {
  font-size:11px;
  padding: 0 0 0 0;
  font-weight:bold;
}

/* ------------------------------------------------------------------------------------------------------------------- */
/* BUTTONS */
/* ------------------------------------------------------------------------------------------------------------------- */

#set_analysis_group {
  display:inline-block;
  width:100%;
  height:50px;
  background-color: #7D0A0A;
  border-style:none;
  border-radius:7px;
  margin: 10px 0 35px 0;
  text-align:center;
  cursor:pointer;
}

#set_analysis_group_text {
  display:inline-block;
  color:white;
  font-family: Helvetica;
  font-size: 16px;
  padding:0 0 0 0;
}

/* ------------------------------------------------------------------------------------------------------------------- */
/* FILTERS PANEL */
/* ------------------------------------------------------------------------------------------------------------------- */

.filters_container {
  background-color: white;
  padding: 15px;
  height:100%;
  overflow-y: auto;
}

.sidebar_filters_titles {
  font-family: Helvetica;
  font-size: 14px;
  font-weight: bold;
  margin: 0 0 15px 0;
}

/* Specific styles for the operator-formation selectors */
.filters_dropdown_btn {
  background-color: #dfdfdf;
  color:black;
  padding: 0 0 0 0;
  font-size: 14px;
  border: none;
  cursor: pointer;
  width:100%;
  height:30px;
  /* border-radius:5px; */
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #f4e7d6;
}

.filters_dropdown {
  position: relative;
  display: inline-block;
  width:100%;
}

.filters_dropdown_content {
  margin:0 0 0 0 ;
  font-size: 14px;
  position: absolute;
  background-color: #ffffff;
  width: 100%;
  border: 1px solid #ddd;
  z-index: 1;
  height: calc(25vh - 100px);
  overflow-y: auto;
  text-align: Left;
}

.filters_dropdown_content a {
  color: black;
  padding: 4px;
  text-decoration: none;
  display: block;

}

.filters_dropdown_content a:hover {
  background-color: #f1f1f1;
  color:black;
  cursor: pointer;
}

.filters_tag_container {
  width:100%;
  padding:0 0 5px 0;
  height: calc(50% - 35px);
  overflow: auto;
  border-style: none none solid none;
  border-color: #ddd;
  border-width: 0.5px;
}

.filters_tag_container_results {
  width:100%;
  padding:0 0 5px 0;
  height: calc(50% - 53px);
  overflow: auto;
  border-style: none none solid none;
  border-color: #ddd;
  border-width: 0.5px;
}


#filters_dropdown_operator_tags {
  margin: 0 0 10px 0;
}

.filters_tags_group_selector {
  width:100%;
  padding:5px 0 5px 0;
  height: calc(48% - 20px);
  overflow: auto;
  border-style: none none solid none;
  border-color: #ddd;
  border-width: 0.5px;
}

.filters_dropdown_results {
  margin:10px 0 0 0;
}

.filters_tag {
  border-style:none none solid none;
  border-width:0.5px;
  border-color:#d6d6d6;
  padding:3px;
  cursor: pointer;
}

.filters_tag:hover {
  background-color: #a10d0d;
  border-color:#a10d0d;
  color:white;
}

.filters_tag_text {
  display:inline-block;
  width:89%;
  font-size: 14px;
  vertical-align: middle;
  text-align: Left;
  padding:0 3px 2px 0;
}

.filters_tag_cross {
  display:inline-block;
  vertical-align: middle;
  width:11%;
  text-align:center;
}


/* ------------------------------------------------------------------------------------------------------------------- */
/* PLOTS */
/* ------------------------------------------------------------------------------------------------------------------- */

.chart_title {
  height:22px;
  font: "Arial";
  font-size: 15px;
  font-weight: bold;
  color: black;
  padding: 0;
}

.chart_title_legend {
  height:25px;
  font: "Helvetica";
  font-size: 14px;
  font-weight: bold;
  color: #494949;
  padding: 0 60px 0 0;
}

.chart_title_selector {
  font-size: 14px;
  float:right;
  font-weight: normal;
  padding: 0 7px 0 0;
}

.chart_title_selector_top {
  font-size: 14px;
  float:right;
  font-weight: normal;
  padding: 5px 7px 0 0;
}

.chart_title_selector_top_end {
  float:right;
  font-size: 14px;
  font-weight: normal;
  padding: 5px 42px 0 0;
}

.chart_expand_icon {
  float:right;
  padding: 0 5px 0 0;
}


.chart_expand_icon:hover {
  cursor:pointer;
}

.FullChartContainer {
  height:calc(100% - 30px);
  width: 100%; 
  padding:0;
}

.FullChartContainer_noTitle {
  height:100%;
  width: 100%; 
  padding:0;
}

.FullChartContainer_noTitle_buttonBar {
  height:calc(100% - 35px);
  width: 100%; 
  padding:0;
  margin:5px 0 0 0;
}

.FullChartContainer_doubleButtonBar {
  height:calc(100% - 70px);
  width: 100%; 
  padding:0;
  margin:5px 0 0 0;
}

.FullChartContainer_narrow {
  height:calc(100% - 90px);
  width: 100%; 
  padding:0 0 10px 0;
}


#ChartContainerR1C1 {
  height:100%;
  width:100%;
  float:left;
}

#ChartContainerR1C2 {
  height:100%;
  width:100%;
  float:left;
}

#ChartContainerR2C1 {
  height:100%;
  width:100%;
  float:left;
}

#ChartContainerR2C2 {
  height:100%;
  width:100%;
  float:left;
}

.ChartContainerResults {
  height:100%;
  width:100%;
  float:left;
}

#ChartContainer {
  height:100%;
  width:calc(100% - 230px);
  float:left;
}

#ChartContainerR1C1WithToggler {
  height:100%;
  width:calc(100% - 230px);
  float:left;
}

#ChartContainerR2C1WithToggler {
  height:100%;
  width:calc(100% - 230px);
  float:left;
}

#ChartLegend {
  height:100%;
  width:200px;
  float:right;
}

#ChartLegendSmall {
  height:100%;
  width:130px;
  float:right;
}

#ChartLegendSmallLeft {
  height:100%;
  width:100px;
  float:left;
  padding:0 0 0 4px;
}

.axis-grid path {
  stroke: none;
}

.axis-grid line {
  stroke: #efefef;
}

input[type="checkbox"]  {
  display: none;
  
}

label:hover {
  cursor:pointer;
}

#ChartLegend {
  padding:20px 0 0 0;
}

.float_right {
  float:right;
}


/* ------------------------------------------------------------------------------------------------------------------- */
/* PLOTS - INNER ELEMENTS: LINES, SELECTORS */
/* ------------------------------------------------------------------------------------------------------------------- */

.brush > .selection {
  fill: #d9ecea;
  opacity: 0.7;
  stroke: #76baaa;
  stroke-width: 3px;
}


/* ------------------------------------------------------------------------------------------------------------------- */
/* PLOT UNDERBUTTONS */
/* ------------------------------------------------------------------------------------------------------------------- */

.button_row_outer {
  height:30px;
  border-style:none none solid none;
  border-width:0.5px;
  border-color:#ddd;
}

.button_row_inner {
  height:29px;
}

.button_cell_container {
  text-decoration: none;
  height: 100%;
}

.button_padding {
  height:29px;
}

.button_padding_pill {
  height:29px;
  padding:0 2px;
}

.button_cell {
  height:100%;
  text-align: center;
  font-size: 14px;
  font:"Helvetica";
}

.button_cell_pill {
  border-style: none solid none none;
  border-width: 0.5px;
  border-color:#e7e7e7;
  height:100%;
  text-align: center;
  font-size: 14px;
  font:"Helvetica";
  padding:2px 0 0 0;
}

.button_cell_pill_end {
  border-style: none solid none solid;
  border-width: 0.5px;
  border-color:#e7e7e7;
  height:100%;
  text-align: center;
  font-size: 14px;
  font:"Helvetica";
  padding:2px 0 0 0;
}



.button_expand {
  background-color: #e7e7e7;
  color:black;
}

.button_expand:hover {
  background-color: #e7e7e7;
  cursor:pointer;
}

.button_others {
  background-color: #ffffff;
  color:black;
}

.button_others:hover {
  background-color: #e9e9e9;
  cursor:pointer;
}

.button_deactivated {
  background-color: #ffffff;
  color:black;
}

.button_transparent {
  background-color: #ffffff;
  color:black;
}

.button_transparent {
  cursor:pointer;
}

/*
.button_expand {
  background-color: #7D0A0A;
  color:white;
}

.button_expand:hover {
  background-color: #a10d0d;
  cursor:pointer;
}

.button_others {
  background-color: #dfdfdf;
  color:black;
}

.button_others:hover {
  background-color: #e9e9e9;
  cursor:pointer;
}

.button_deactivated {
  background-color: #dfdfdf;
  color:white;
}
  */


/* ------------------------------------------------------------------------------------------------------------------- */
/* RESULTS PLOTS INTERACTIVE ELEMENTS */
/* ------------------------------------------------------------------------------------------------------------------- */

.resultsTooltip {
  position: absolute;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 5px;
  font-size: 12px;
  pointer-events: none;
  opacity: 0;
}



/* ------------------------------------------------------------------------------------------------------------------- */
/* Add new operator button */
/* ------------------------------------------------------------------------------------------------------------------- */

.add_operator_container {
  width:100%;
  text-align: right;
}

.add_operator_button {
  background-color: #7D0A0A;
  color: white;
  border: none;
  padding: 7px 20px;
  font-size: 13px;
  cursor: pointer;
  margin:7px 0 0 0 ;
}

.add_operator_button:hover {
  background-color: #a10d0d;;
}




#group_color_selector {
  height:26px;
  margin: 0 0 10px 0;
}

.group_color_selector_row {
  height: 27px;
}

.col-selector {
  height: 100%;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border-style: none;
}

.group_color_selector_mid {
  height: 100%;
  /* padding:4px; */
}

.group_color_selector_inner {
  height: 100%;
  background-color: #0000ff;
  border-style: solid;
  border-width: 2px;
  border-color: #fff;
}

.group_color_selector_inner_selected {
  border-style: solid;
  border-width: 2px;
  border-color: #000000;
}

.group_color_selector_inner:hover {
  border-style: solid;
  border-width: 2px;
  border-color: #000000;
}


#color_group_a {
  background-color: #e60000;
}

#color_group_b {
  background-color: #0000ff;
}

#color_group_c {
  background-color: #008000;
}

#color_group_d {
  background-color: #ffd700;
}



/* =================================================================================================================== */
/* NEW STYLES FOR THE DASHBOARD CELLS */
/* =================================================================================================================== */

.new_button_row_outer {
  height: 30px;
  padding: 2px;
  border-bottom: 0.5px solid #ddd;
  background-color: #fff;
}

.new_button_row_inner {
  height: 100%;
  display: flex;
  align-items: center;
}

.new_title_flex_grow {
  font-size: 11px;
  font-weight: bold;
  flex-grow: 1;
  padding-left: 5px;
  word-break: break-word;
  white-space: normal;
}

.new_mid_button {
  font-size: 11px;
  padding: 0 10px;
  border-left: 0.5px solid #dfdfdf;
  cursor: pointer;
  display: flex;
  align-items: center;
  height: 25px;
}

.new_mid_button_navigation {
  width: 110px;
  justify-content: center;
}

.new_expand_button {
  width: 30px;
  height: 25px;
  padding: 0 7px;
  border-left: 0.5px solid #dfdfdf;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.new_mid_button:hover,
.new_expand_button:hover {
  background-color: #f3f3f3;
}


.new_dropdown_button {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 10px;
  height: 25px;
  border-left: 0.5px solid #dfdfdf;
  cursor: pointer;
  user-select: none;
}

.new_dropdown_button_date {
  width: 150px;
  justify-content: center;
}

.dropdown_caret {
  margin-left: 6px;
  padding-top: 2px;
}

.dropdown_label {
  font-size: 11px;
}

.dropdown_menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: white;
  border: 0.5px solid #dfdfdf;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  z-index: 10;
  width: 150px;
  justify-content: center;
}

.dropdown_menu div {
  padding: 6px 10px;
  font-size: 11px;
  cursor: pointer;
  white-space: nowrap;
  text-align: center;
}

.dropdown_menu div:hover {
  background-color: #f0f0f0;
}



.test_test_table_wrapper {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.test_test_table_grid {
  flex: 1 1 auto; /* Let it fill vertically */
  width: 100%;
  height: 100%;
  border-collapse: collapse;
}

.test_test_table_grid tr {
  height: 10%; /* Optional: stretch to fixed proportions */
}

.test_test_table_grid th,
.test_test_table_grid td {
  vertical-align: middle;
  padding: 2px 6px;
  font-size: 11px;
}

.test_table_label {
  max-width: 200px;
  text-align: left;
  font-weight: bold;
  white-space: normal;
  word-break: break-word; 
}

.test_table_data {
  white-space: normal;
  text-align: center;
}

.test_table_spacer {
  width: 30px;
  background: transparent;
}

/* Alternating row background */
.test_test_table_grid tr:nth-child(even) {
  background-color: #f0f0f0;
}