/**
 * Styling for the INZ irrigation graph.
 *
 * @author: H Paterson.
 * @copyright: Iris Data Science, 2020.
 */

#graph-div
{
    width: 100%;
    height: 100%;
    margin-top: 10px;
    position: relative;
}

#graph
{
    width: 100%;
    height: 100%;
}

#graph .no-data
{
    fill: rgb(255, 99, 99);
    font-size: 1.5em;
}

#data-container h1, #data-container h2
{
  margin: 0;
  padding: 0;
  color: #2993b2;
  text-align: center;
}

#data-container h1
{
  font-size: 24px;
  font-weight: 900;
  font-family: sans-serif;
}
#data-container h2
{
  font-size: 18px;
  font-weight: normal;
}

.axis
{
    stroke-width: 3;
    color: #2993b2;
    font-weight: bold;
    font-size: larger;
    font-family: 'Montserrat', sans-serif;
}

.data-point-normal {
    stroke-width: 1px;
    stroke: black;
}

.trend-point {
  stroke: #c76400;
  fill: #ff9a34;
}

.data-point-highlight {
    stroke: #52bf9f;
    cursor: pointer;
    fill: #52bf9f;
}

.data-line {
  fill: none;
  stroke-width: 3;
  stroke: #ff9a34;
}

.data-line-highlight {
  fill: none;
  stroke: #2993b2;
  stroke-width: 3.5;
}

.data-line:hover {
  stroke: #c76400;
  stroke-width: 6;
  fill: none;
  cursor: pointer;
}

rect.selection {
    fill: #2993b2;
    fill-opacity: 0.3;
    stroke: #2993b2;
    stroke-width: 3;
    stroke-dasharray: 6 6;
}

.shaded-region {
    fill: #2993b2;
    fill-opacity: 0.1;
}

#shaded-trend-region {
    fill: #b2d235;
}

#trend-label, .data-label {
  stroke: none;   
  fill: #2993b2;
  font-family: 'Montserrat', sans-serif;
  font-size: 1em;
  text-anchor: middle;
}

.label-title {
  font-weight: bold;
  fill: #2993b2;
  font-family: 'Montserrat', sans-serif;
}

.label-measurement {
  font-weight: bold;
  fill: #2993b2;
  font-family: 'Montserrat', sans-serif;
  font-size: 1em;
  text-anchor: middle;
}

.label-background {
  fill: white;
  stroke: #2993b2;
  stroke-width: 3px;
}

#graph-info {
  position: relative;
  padding-right: 60px;
}

#graph-info button
{
  position: absolute;
  right: 15px;
  top: 15px;

  background-color: #2993b2;
  border: none;
  margin: 2px;
  width: 40px;
  height: 40px;
}
#graph-info button:hover {
  cursor: pointer;
}
#graph-info button:active {
  background-color: #52bf9f;
}

#label-date {
  fill: #2993b2;
  font-family: 'Montserrat', sans-serif;
  font-size: 1em;
  text-anchor: middle;
}

.warning-selection-stroke {
  stroke: red !important;
}
.warning-selection-fill {
  fill: red !important;
}