/** -------------------------------------------------- */
/** Začiatok: Definovanie globálnych premenných pre farby */
/** -------------------------------------------------- */

:root {
  --color-table-border: #e0e0e0;
  --color-table-background-primary: #eff5fe;
  --color-table-hover: #eeeeee;
  --color-text-link: #126dff;
  --color-text-link-hover: #0b4199;
  --color-text-notes: #757575;
  --color-button-background: #eff5fe;
  --color-button-background-hover: #c3d9f9;
  --color-button-border: #126dff;
  --color-button-text: #072c66;
  --color-crosshair: #d3d3d3;
}

/** -------------------------------------------------- */
/** Koniec: Definovanie globálnych premenných pre farby */
/** -------------------------------------------------- */

/** -------------------------------------------------- */
/** Začiatok: Celý blok s grafom a tabuľkou */
/** -------------------------------------------------- */

#highcharts-block {
  margin: 20px 0;
}

div.body-text #highcharts-block ul li {
  list-style-type: none;
}

/** -------------------------------------------------- */
/** Koniec: Celý blok s grafom a tabuľkou */
/** -------------------------------------------------- */

/** -------------------------------------------------- */
/** Začiatok: Tabuľka */
/** -------------------------------------------------- */

#highcharts-block details table {
  width: 50%;
  border-collapse: collapse;
  margin: 0;
  font-size: 14px;
  text-align: left;
  width: 100%;
  font-family: Arial, "sans-serif";
  border: 1px solid var(--color-table-border);
}

#highcharts-block details caption {
  background-color: var(--color-table-background-primary);
  text-align: left;
  font-weight: 700;
  padding: 12px 15px 12px 15px;
  border-top: 1px solid var(--color-table-border);
  border-right: 1px solid var(--color-table-border);
  border-left: 1px solid var(--color-table-border);
  font-size: 14px;
  margin-top: 0;
}

#highcharts-block details thead {
  background-color: var(--color-table-background-primary);
}

#highcharts-block details th,
#highcharts-block details td {
  padding: 12px 0 12px 15px;
  border-top: 1px solid var(--color-table-border);
  border-bottom: 1px solid var(--color-table-border);
}

#highcharts-block details th:nth-child(1) {
  text-align: left;
  padding: 12px 0 12px 15px;
}

#highcharts-block details th {
  padding: 12px 15px 12px 0;
  text-align: right;
}

#highcharts-block details tbody tr:hover {
  background-color: var(--color-table-hover);
}

#highcharts-block details td:nth-child(1) {
  text-align: left;
  padding: 12px 0 12px 15px;
}

#highcharts-block details td {
  padding: 12px 15px 12px 0;
  text-align: right;
}

/*! V prípade dátumu sa v bunke zmení zarovnanie textu */
#highcharts-block details td.ta-left,
#highcharts-block details th.ta-left {
  padding: 12px 15px 12px 0;
  text-align: left;
}

/** -------------------------------------------------- */
/** Koniec: Tabuľka */
/** -------------------------------------------------- */

/** -------------------------------------------------- */
/** Začiatok: Tlačidlo na rozbalenie a zabalenie tabuľky */
/** -------------------------------------------------- */

#highcharts-block summary {
  background-color: var(--color-button-background);
  width: fit-content;
  color: var(--color-button-text);
  font-weight: 700;
  cursor: pointer;
  padding: 8px 15px 8px 12px;
  border-radius: 5px;
  font-size: 14px;
  margin-top: 20px;
  font-family: Arial, "sans-serif";
  border: 2px solid var(--color-button-border);
}

#highcharts-block summary:hover {
  background-color: var(--color-button-background-hover);
}

#highcharts-block details > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

#highcharts-block details[open] > summary {
  margin-bottom: 20px;
}

#highcharts-block details > summary::before {
  content: url("../images/plus.png");
  display: inline-block;
  width: 20px;
  height: 28px;
  vertical-align: middle;
}

#highcharts-block details[open] > summary::before {
  content: url("../images/minus.png");
}

/** -------------------------------------------------- */
/** Koniec: Tlačidlo na rozbalenie a zabalenie tabuľky */
/** -------------------------------------------------- */

/** -------------------------------------------------- */
/** Začiatok: Štýly pre crosshair */
/** -------------------------------------------------- */

#highcharts-block .highcharts-selection-marker {
  fill: var(--color-crosshair) !important;
  opacity: 0.4;
}

/** -------------------------------------------------- */
/** Koniec: Štýly pre crosshair */
/** -------------------------------------------------- */

/** -------------------------------------------------- */
/** Začiatok: Štýly pre odkaz v zdroji */
/** -------------------------------------------------- */

#highcharts-block .highcharts-credits .credits-link {
  color: var(--color-text-link);
  text-decoration: none;
  border-bottom: 1px solid var(--color-text-link);
}

#highcharts-block .highcharts-credits .credits-link:hover {
  fill: var(--color-text-link-hover) !important;
  text-decoration: none !important;
}

#highcharts-block .zdroj .credits-link:hover {
  color: var(--color-text-link-hover) !important;
  text-decoration: none !important;
}

/** -------------------------------------------------- */
/** Koniec: Štýly pre odkaz v zdroji */
/** -------------------------------------------------- */

/** -------------------------------------------------- */
/** Začiatok: Štýly pre poznámku a zdroj pod tabuľkou */
/** -------------------------------------------------- */

#highcharts-block .poznamka p,
#highcharts-block .zdroj p {
  font-size: 14px;
  font-family: Arial;
  padding: 15px;
  margin: 0;
  border-right: 1px solid var(--color-table-border);
  border-left: 1px solid var(--color-table-border);
}

#highcharts-block .poznamka p {
  color: var(--color-text-notes);
  padding-bottom: 0;
  padding-top: 0;
  cursor: default;
}

#highcharts-block .poznamka p:first-of-type {
  padding-top: 15px;
}

#highcharts-block .zdroj p {
  padding-top: 15px;
  border-bottom: 1px solid var(--color-table-border);
  /* margin-bottom: 20px; */
}

/** Odstránenie ikony pri odkaze **/
div.body-text #highcharts-block p a[target="_blank"]:link {
  background: none;
  padding: 0 !important;
}

/** -------------------------------------------------- */
/** Koniec: Štýly pre poznámku a zdroj pod tabuľkou */
/** -------------------------------------------------- */