.chart-container {
  position: relative;
  height: 400px;
  width: 100%;
}

.currentChart-wrapper,
.temperatureChart-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 1;
  min-height: 300px;
}

.margin-top-50 {
  margin-top: 50px;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.mb-3 {
  margin-bottom: 1rem;
}

/* ====================== */
/* TABLE DESKTOP / TABLET */
/* ====================== */
.table-wrapper {
  overflow-x: auto;
}

.ux-table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
}

.ux-table th,
.ux-table td {
  border: 1px solid #ddd;
  padding: 8px;
}

.sticky-col {
  position: sticky;
  left: 0;
  background-color: #f9f9f9;
  z-index: 2;
  text-align: center;
}

.temp-col {
  font-weight: bold;
  text-align: left;
}

/* Hover ligne entière */
.ux-table tbody tr:hover {
  background-color: rgba(0, 123, 255, 0.1);
  font-weight: bold;
}

/* Alignement à droite des valeurs */
.text-right {
  text-align: right;
  font-variant-numeric: tabular-nums;
  /* décimales alignées */
}

.ux-table tr td,
.ux-table tr th {
  border: none;
  border-top: 1px solid #e7ecf1;
}

/* ====================== */
/* MOBILE CARDS VERSION */
/* ====================== */
.mobile-cards {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.ux-card {
  border: 1px solid #ddd;
  padding: 10px;
  background-color: #fff;
  margin: 15px;
}

.ux-card-header {
  font-weight: bold;
  margin-bottom: 5px;
}

.ux-card-body .label {
  color: #5c6873
}

.ux-card-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.ux-card-row {
  display: flex;
  justify-content: space-between;
}

/* ====================== */
/* HEATMAP SIMPLE EXEMPLE */
/* ====================== */
.heatmap[data-value] {
  transition: background-color 0.3s;
}

@media only screen and (min-width: 1201px) {

  .page_nc_lab_reports_load_current_calculator .container {
    max-width: 1190px;
  }

  form.current-capacity-calculator-form .row {
    display: flex;
  }
}


@media only screen and (max-width: 1200px) {
  form.current-capacity-calculator-form .row {
    margin-left: auto;
    margin-right: auto;
  }

  form.current-capacity-calculator-form .col-xs-3 {
    width: 100%;
    z-index: 999;
  }

  form.current-capacity-calculator-form .col-xs-3.text-center.c-margin-t-50 {
    margin-left: auto;
    margin-right: auto;
    display: contents;
  }

  form.current-capacity-calculator-form .col-xs-3 {
    width: 100%;
    z-index: 999;
  }

  form.current-capacity-calculator-form .col-xs-3.text-center.c-margin-t-50 {
    margin-left: auto;
    margin-right: auto;
    display: contents;
  }

  form.current-capacity-calculator-form .col-xs-3.text-center.c-margin-t-20 {
    margin-left: auto;
    margin-right: auto;
    display: contents;
  }


}