/*Define some standard variable*/
:root {
  --main-border-radius: 10px;
  --main-box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
  --main-accent-bg: #b2dff5;
  --main-accent-color: #007ab8;
}

/*center maintabs*/
#maintabs {
  display: flex;
  justify-content: center;
}

/*center dattabs*/
ul[id$='-dattabs'] {
   justify-content: center;
 }
/* mache datatree scrollable (#firstlayer-datatree)*/
div[id$='-datatree'] {
  height: auto !important;
  /*overflow-y: hidden;*/
}
/* pointer trashicon in datatables warenkorb */
td.delete-control {
  cursor: pointer;
}

/* fülle leeren raum zwischen geoauswahl und rest
#firstlayer-fgtabs-div {
  position: relative;
  top: -30vh;
}
*/

/*hide checkboxes*/
.no_checkbox>i.jstree-checkbox
{
    display:none
}

.hidetab {
  cursor: not-allowed !important;
  pointer-events: all !important;
}

.hidetab:hover:after {
  content: "Zu viele Daten für Zeitreihe ausgewählt. Bitte Daten oder geographische Einheiten reduzieren.";
  position: absolute;
  display: inline-block;
  border-bottom: 1px dotted black;
  background-color: rgba(0, 0, 0, 1);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  transform: translateY(20px);
  z-index: 999999;
  width: 400px;
  margin-left: -200px;
  padding: 10px;
}

.hidetab2 {
  cursor: not-allowed !important;
  pointer-events: all !important;
}

.hidetab2:hover:after {
  content: "Keine der ausgewählten Daten sind auf Bezirks oder Gemeindeebene verfügbar.";
  position: absolute;
  display: inline-block;
  border-bottom: 1px dotted black;
  background-color: rgba(0, 0, 0, 1);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  transform: translateY(20px);
  z-index: 999999;
  width: 400px;
  margin-left: -200px;
  padding: 10px;
}

#infomodaldiv .modal-dialog {
  width: 90% !important;
}
#shiny-modal {
  top: auto;
}
div.load-container {
  top: 10%;
}

div[id$=-varsdiv] div {
  margin-bottom: 0px;
}

/* accordion icon */
.panel-heading .accordion-toggle:after {
/* symbol for "opening" panels */
font-family: 'Glyphicons Halflings'; /* essential for enabling glyphicon */
content: "\e114"; /* adjust as needed, taken from bootstrap.css */
float: left; /* adjust as needed */
color: var(--main-accent-color); /* adjust as needed */
margin-right: 10px;
}

.panel-heading .accordion-toggle.collapsed:after {
/* symbol for "collapsed" panels */
content: "\e080"; /* adjust as needed, taken from bootstrap.css */
}

.panel-heading .accordion-toggle {
  color: var(--main-accent-color);
}

/* mache svg gefüllt */
div[id^='auswahl-geoselect-svg'] path {
  fill: var(--main-accent-color);
  stroke: #000000;
  stroke-width: 50px;
  cursor: pointer;
}

div[id^='auswahl-geoselect-svg'] svg {
  overflow: visible;
}

.selgem {
  fill: #ffa81f !important;
}

.selbez {
  fill: #A05388 !important;
  stroke: #000000 !important;
}

.selgem.selbez {
  fill: #ffa81f !important;
  stroke: #000000 !important;
}

.pth-description {
  pointer-events: none;
  position: absolute;
  font-size: 18px;
  text-align: center;
  background: white;
  padding: 10px 15px;
  z-index: 5;
  height: 38px;
  line-height: 18px;
  margin: 0 auto;
  color: #21669e;
  border-radius: 5px;
  box-shadow: 0 0 0 1px #eee;
  transform: translateX(-50%);
  display: none;
}
.pth-description.active {
    display: table;
}
.pth-description.active:after {
   content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    width: 0;
    height: 0;
    margin-left: -10px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid white;
}

#tabelle-table {
  border-radius: var(--main-border-radius);
  margin: 10px;
  width: 99% !important;
  padding: 10px;
}

body {
  font-size: 1.6rem;
}

.dataTables_scrollHead {
  border-top-left-radius: var(--main-border-radius);
  border-top-right-radius: var(--main-border-radius);
  background-color: var(--main-accent-bg);
}
/*
#zeitreihe-tmsr .main-svg {
  width: 99%;
  margin: 10px;
  padding: 10px;
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow);
}
*/
.footer {
  position: static;
}

.well {
  border-radius: var(--main-border-radius);
  box-shadow: var(--main-box-shadow);
}


div[id$='mapinpsdiv'] {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 5px;
  padding-bottom: 5px;
}
/*
div[id$='secondmapinpsdiv'] {
  margin-top: 20px;
}

.accordion-title {
  font-size: 16px;
}

.accordion-button{
      background-color: var(--main-accent-bg) !important;
      color: black;
}
*/
.card {
  border-radius: var(--main-border-radius);
}

.card-header {
  font-size: 2rem !important;
}

.nav-underline .nav-link:not(.disabled) {
  font-weight: 500;
  color: var(--main-accent-color);
}

.nav-underline .nav-link.active {
  color: var(--main-accent-color) !important;
}

.form-control {
  font-size: 1.6rem;
}

/*  deactivate ktag .grid pointer events: none because it disables inpusts in blib columns and normal letter spacing*/
.grid {
  pointer-events: all !important;
  letter-spacing: normal !important;
}
/* Geoselect-all custom buttons */
div[id$='-geopckall'] label {
  border-radius: 3px;
  border-color: black;
  background-color: #ffffff;
}

div[id$='-geopckall'] label:hover {
  background-color: #404040 !important;
  color: #ffffff !important;
  border-color: black !important;
}

/*buttons inside selectpicker*/
.dropdown-menu button {
  border-radius: 3px !important;
  border-color: black !important;
  background-color: #ffffff !important;
}

.dropdown-menu button:hover {
  background-color: #404040 !important;
  color: #ffffff !important;
  border-color: black !important;
}
.btn.dropdown-toggle {
  border-color: black;
  background-color: #ffffff;
}

/* center extraformula div content*/
div[id$='-extvarformula'] {
  text-align: center !important;
}

/*warenkorb table buttons*/
.dt-btn {
  border-color: black;
  border-style: solid;
  border-width: 1px;
  border-radius: 3px;
  background-color: #ffffff;
}
.dt-btn:hover {
  background-color: #404040;
}

button.dt-button.buttons-collection {
  border-color: black;
  border-style: solid;
  border-width: 1px;
  border-radius: 3px;
  background: #ffffff;
  padding: 2.5px;
}
button.dt-button.buttons-collection:hover {
  background: #404040 !important;
  background-color: #404040 !important;
  color: #ffffff;
}

.dt-buttons {
  width: 100%;
  text-align: center;
}
/* Overwrite some .modal params from modal.scss (ktag)  */
.modal {
  background-color: unset !important;
  z-index: 1055 !important;
}

#auswahl-auswahl-row .card {
  box-shadow: none;
}

.jstree-icon {
  color: var(--main-accent-color);
}

.nav-link {
  font-size: 2rem;
}

.nav-link.active {
  font-size: 2rem;
}

/*font für jstree leafs*/
.shinytree-leaf {
  font-size: 1.3rem;
}

#graph-tutbtn {
  padding: 0.25rem;
}

.modal {
  --bs-modal-margin: 5%;
}

/* Datepicker stuff */
.cstmdtpck {
  font-size: 1.2rem;
}

.ui-datepicker-header {
  background-color: var(--main-accent-bg) !important;
}
.ui-datepicker {
  border-radius: 5px !important;
}
.ui-state-default {
  background: white !important;
  border-radius: 3px !important;
  color: black !important;
}
.ui-state-hover {
  background: #404040 !important;
  color: #ffffff !important;
}
#auswahl-warenkorb-intv {
  padding: 0.25rem;
}

/*70vh height only for non mobile devices*/
@media only screen and (min-width: 768px) {
  #auswahl-auswahl-row > div {
    height: 70vh;
  }
}
/*for mobile restrict card height to 95vh*/
@media only screen and (max-width: 768px) {
  .bslib-card {
    max-height: 85vh;
  }
}