@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700&display=swap');
td.nowrap {
    white-space: nowrap;
}

#title {
    font-size: 35px;
    font-weight: 400;
    font-family: 'Roboto Condensed';
    color: black;

}

#logo {
    position: absolute;
    top: 15px;
    left: 20px;
}

#stats {
    color:black;
    /* text-shadow: 2px 2px 4px #000000; */
}

#capture {
    position: relative;
    position: relative;
    top: auto;
    display: inline-flex;
    flex-wrap: wrap;
    /* background: linear-gradient(to right, rgba(47,122,142,1), rgba(139,73,189,1), rgba(46,122,142,1)); */
}

#container, .highcharts-legend-item {
    font-family: 'Roboto Condensed', sans-serif;
}

@media print {
    .climate-table-wrapper{
    overflow: visible !important;   /* no clipping */
    }
    .climate-table{
    transform: scale(0.90);         /* 90 % of normal size */
    transform-origin: top left;     /* keep upper-left corner anchored */
    }
}
.climate-table-wrapper{
    overflow-x:auto;
    width:960px;
}
/* Table Styling */
.climate-table {
    width: 100%;
    font-size: 11pt;
    margin-top: 990px;
    border-collapse: collapse;
    font-family: 'Roboto Condensed', sans-serif;
    /* background: linear-gradient(to right, rgba(33,89,104,1), rgba(112,48,160,1), rgba(33,89,104,1));
    background-color: rgba(0, 0, 0, 0.3);
    color: white; */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.climate-table th {
    /* background-color: rgba(0, 0, 0, 0.5); */
    padding: 5px;
    text-align: center;
    font-weight: 700;
    border: 1px solid #000;
}

.climate-table td {
    padding: 5px;
    border: 1px solid #000;
    text-align: center;

}
.observed { font-weight:700; }

.month-high { color:#f0f; font-weight:700; }
.month-low  { color:#08f; font-weight:700; }

.hc-icon-high     { color:#f0f; font-size:0.85em; position:absolute; }
.hc-icon-low      { color:#08f; font-size:0.85em; position:absolute;  }

.hc-icon-highmin  { color:#f0f; font-size:0.78em; position:absolute; }
.hc-icon-lowmax   { color:#08f; font-size:0.78em; position:absolute; }

.positive { color: rgba(255, 0, 255, 1); }
.negative { color: rgba(0, 136, 255, 1); }
.positive-pcpn { color: rgba(0, 255, 200, 1); }
.negative-pcpn { color: rgba(255, 0, 255, 1); }

.rechi-cell { background-color:rgba(255, 0, 0, 0.2)  !important; }
.reclo-cell { background-color:rgba(0, 0, 255, 0.2)  !important; }

.normal-cell { background-color:rgba(0, 0, 0, 0.1)  !important; }
.precip-cell { background-color:rgba(0, 255, 0, 0.2) !important; }
.snow-cell   { background-color:rgba(0,100,255,0.2) !important; }
.depth-cell   { background-color:rgba(160,0,255,0.2) !important; }

#controls {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size:1.2em;
    align-items: center;
    padding: 20px;
    background:rgba(0,0,0,0.1);
    border-bottom: 1px solid #ddd;
}

select,
input[type='month'] {
    padding: 0.4rem 0.6rem;
    border-radius: 6px;
    border: none;
    font-size: 1rem;
}

.stat-value {
    display: inline-block;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 15px;
    font-family: 'Roboto Condensed', sans-serif;
}

.stat-departure {
    display: inline-block;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    text-shadow: none;
}