/* --- START OF FILE squeeze_analysis.css --- */
html,
body {
    background-color: #101010 !important;
    color: white;
    font-family: "IBM Plex Serif", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
}



.chart-wrapper {
    position: relative;
    height: 65vh; /* 65% of the viewport height */
    min-height: 400px;
    background-color: #2a2a2e;
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid #3a3a3e;
}

.control-card .card-body {
    padding: 1.5rem;
}

.analysis-mode-toggle .btn {
    padding: 0.5rem 1.25rem;
}

.analysis-mode-toggle .btn-check:checked+.btn {
    background-color: #0DCAF0;
    border-color: #0DCAF0;
    color: #fff;
}

/* Styles for Small Multiples (Compare by Week) */
.squeeze-chart-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 1.5rem;
}

.mini-chart-card {
    background-color: #2a2a2e;
    border: 1px solid #3a3a3e;
    border-radius: 8px;
    padding: 1rem;
}

.mini-chart-wrapper {
    position: relative;
    height: 250px; /* Give each mini-chart a fixed height */
}

/* --- squeeze_analysis.css (FINAL VERSION) --- */
/* This file contains styles for the Squeeze Data Analysis page. */

/*
  This ensures that the browser automatically adjusts column widths based on their content,
  which works perfectly now that the tables have plenty of horizontal space.
*/
#squeezeChartGrid .table {
    table-layout: auto;
    width: 100%;
    font-size: 0.9rem;
}

/*
  These rules ensure all text is vertically centered and that long strings in the
  "Watering Program" and "Variety Name" columns can wrap onto a new line if needed,
  preventing any unwanted stretching or scrollbars.
*/
#squeezeChartGrid .table th,
#squeezeChartGrid .table td {
    vertical-align: middle;
    white-space: normal; /* Allow text to wrap naturally */
    word-wrap: break-word;
}

/* Add a bit more space to the two longest columns for better readability */
#squeezeChartGrid .table th:nth-child(1), /* Variety Name */
#squeezeChartGrid .table td:nth-child(1) {
    width: 20%;
}

#squeezeChartGrid .table th:nth-child(6), /* Watering Program */
#squeezeChartGrid .table td:nth-child(6) {
    width: 20%;
}

/* Center-align the text in the headers and cells of numeric columns */
#squeezeChartGrid .table th:nth-child(2), /* pH */
#squeezeChartGrid .table td:nth-child(2),
#squeezeChartGrid .table th:nth-child(3), /* EC */
#squeezeChartGrid .table td:nth-child(3),
#squeezeChartGrid .table th:nth-child(7), /* Boom EC */
#squeezeChartGrid .table td:nth-child(7) {
    text-align: center;
}