/*
 * Stylesheet for AKIPS SVG Graphs.
 */


.svg-path-fill-color
{
   fill: rgb(119, 119, 119) !important;
}

:root.dark .svg-path-fill-color
{
   fill: rgb(249, 249, 249) !important;
}

.rect
{
   fill: rgb(255, 255, 255);
}

:root.dark .rect
{
   fill: rgb(53, 52, 52);
}

text
{
   font-family: 'Droid Sans', sans-serif;
   font-weight: normal;
   font-style:  normal;
   font-size:   14px;
}

polyline.graph_plot   { fill:   none;    stroke-width: 2; }
polyline.graph_axis   { stroke: rgb(164, 164, 164); stroke-width: 1; }
polyline.graph_tick   { stroke: rgb(164, 164, 164); stroke-width: 1; }
polyline.graph_target { stroke: rgb(164, 164, 164); stroke-width: 1; }

/* Calendar drilldown */
.graph_cal
{
   stroke:       rgb(164, 164, 164);
   stroke-width: 1;
   fill:         pink;
   fill-opacity: 0;
}

a > rect.graph_cal:hover
{
   stroke:       rgb(164, 164, 164);
   stroke-width: 1;
   fill:         rgb(232, 232, 232);
   fill-opacity: 0.3;
}

/* Linear drilldown */
.graph_drill
{
   stroke:       none;
   fill:         pink;
   fill-opacity: 0;
}

.graph_drill:hover
{
   stroke:       none;
   fill:         rgb(232, 232, 232);
   fill-opacity: 0.3;
}

.graph_s0  { stroke: rgb(93, 165, 218);       } .graph_f0  { fill: rgb(93, 165, 218);      }
.graph_s1  { stroke: rgba(250, 164, 58, 0.7); } .graph_f1  { fill: rgba(250,164, 58, 0.7); }
.graph_s2  { stroke: rgb(96, 189, 104);       } .graph_f2  { fill: rgb(96, 189, 104);      }
.graph_s3  { stroke: rgb(241, 124, 176);      } .graph_f3  { fill: rgb(241, 124, 176);     }
.graph_s4  { stroke: rgb(255, 0, 0);          } .graph_f4  { fill: rgb(255, 0, 0);         }
.graph_s5  { stroke: rgb(222, 207, 63);       } .graph_f5  { fill: rgb(222, 207,63);       }
.graph_s6  { stroke: rgb(178, 118, 178);      } .graph_f6  { fill: rgb(178, 118, 178);     }
.graph_s7  { stroke: rgb(178, 145, 47);       } .graph_f7  { fill: rgb(178, 145, 47);      }
.graph_s8  { stroke: rgb(77, 77, 77);         } .graph_f8  { fill: rgb(77, 77, 77);        }

/* Blues */
.graph_s9  { stroke: rgb(0, 191, 255);  } .graph_f9  { fill: rgb(0, 191, 255);  }
.graph_s10 { stroke: rgb(138, 43, 226); } .graph_f10 { fill: rgb(138, 43, 226); }

/* Red */
.graph_s11 { stroke: rgb(204, 54, 54); }  .graph_f11 { fill: rgb(204, 54, 54); } /* Red */


/* Orange */
.graph_s12 { stroke: rgb(255, 165, 0); } .graph_f12 { fill: rgb(255, 165, 0); }
.graph_s13 { stroke: rgb(255, 69, 0);  } .graph_f13 { fill: rgb(255, 69, 0);  }
.graph_s14 { stroke: rgb(238, 64, 0);  } .graph_f14 { fill: rgb(238, 64, 0);  }
.graph_s15 { stroke: rgb(205, 55, 0);  } .graph_f15 { fill: rgb(205, 55, 0);  }
.graph_s16 { stroke: rgb(139, 37, 0);  } .graph_f16 { fill: rgb(139, 37, 0);  }

:root.dark .graph_f4
{
   fill:  rgb(241, 88, 84);
}

:root.dark .graph_f11
{
   fill:  rgb(241, 88, 84);
}

.graph_line
{
   fill:         none;
   stroke-width: 1.0;
}

.graph_fill
{
   stroke-opacity: 0.3;
   fill-opacity:   0.3;
}

:root.dark .graph_fill
{
   fill-opacity:   0.75;
}

.graph_avail_box
{
   stroke:       rgb(191, 191, 191);
   stroke-width: 1.0;
   fill:         none;
}

.graph_avail_above { stroke: rgb(93, 165, 218); fill: rgb(93, 165, 218); }
.graph_avail_below { stroke: rgb(250, 164, 58); fill: rgb(250, 164, 58); }


/*
 * Text
 */

text
{
   stroke:      none;
}

text.graph_title
{
   fill:        rgb(68, 68, 68);
   font-size:   16px;
   white-space: pre;
}

:root.dark text.graph_title
{
   fill:        rgb(236, 236, 236);
}

text.graph_subtitle
{
   fill:        rgb(51, 51, 51);
   font-size:   14px;
}

:root.dark text.graph_subtitle
{
   fill:        rgb(206, 206, 206);
}

text.graph_axis,
text.graph_label
{
   fill:        rgb(51, 51, 51);
   font-size:   12px;
}

:root.dark text.graph_axis,
:root.dark text.graph_label
{
   fill:        rgb(206, 206, 206);
}

text.graph_legend
{
   fill:        rgb(51, 51, 51);
   font-size:   12px;
   font-weight: bold;
   white-space: pre;
}

text.graph_date,
text.graph_weekday
{
   fill:        rgb(164, 164, 164);
}

text.graph_nav
{
   fill:        blue;
}

.topn text.graph_title
{
   font-size:   14px;
}

.topn text.graph_subtitle
{
   font-size:   12px;
}


/*
 * Buttons
 */

.graph_button rect
{
   fill: rgb(221, 221, 221);
}

.graph_button text
{
   fill: rgb(51, 51, 51);
   font-size:    12px;
}

:root.dark .graph_button text
{
   fill: rgb(236, 236, 236);
}

.graph_button a:hover
{
   text-decoration: none;
   opacity:         0.75;
}