/* Scrollbar – Webkit */
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: #1E1E1E; }
::-webkit-scrollbar-thumb { background-color: #353535; border-radius: 10px; border: 2px solid #000000; }
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* Scrollbar – Firefox */
html { scrollbar-width: thin; scrollbar-color: #353535 #1E1E1E; }

/* General */
body { background-color: #000000; color: #FFFFFF; }

/* Card */
.eigeneCard { background-color: #000000; border: 3px solid #000000; }
.eigeneCardHeader { background-color: #000000; color: #BABABA; }

/* Table */
table { border: 1px solid #353535; border-collapse: collapse; width: 100%; }
.eigeneTabelle { background-color: #000000; }
.eigeneTabelle th { background-color: #353535; color: #BABABA; border: 1px solid #1E1E1E; text-align: center; }
.eigeneTabelle td { background-color: #1E1E1E; color: #BABABA; border: 1px solid #353535; text-align: center; }

/* Input fields */
.form-control { background-color: #000000 !important; color: #616161 !important; border: 1px solid #1E1E1E !important; }
.form-control::placeholder { color: #616161; }
.form-control:focus { background-color: #000000 !important; color: #BABABA !important; border-color: #353535 !important; outline: none !important; box-shadow: 0 0 10px #BABABA; }

/* Buttons */
.btn-primary { background-color: #C38FFF; border: 1px solid #C38FFF !important; color: #000000; font-weight: bold; font-size: 1rem; }
.btn-primary:hover { background-color: #C38FFF !important; border: 1px solid #C38FFF !important; color: #000000; box-shadow: 0 0 20px #BABABA; font-weight: bold; font-size: 1rem; }
.btn-primary:active { background-color: #C38FFF !important; border: 1px solid #C38FFF !important; color: #000000; box-shadow: 0 0 20px #BABABA; font-weight: bold; font-size: 1rem; }

/* Empfohlene Einführungstiefe */
.einfuehrTiefe { text-align: center; padding-top: 20px; display: flex; justify-content: center; align-items: center; height: 100%; background-color: #353535 !important; color: #BABABA !important; }
.deci-number { position: relative; padding-top: 20px; padding-bottom: 20px; }
.einfuehrTiefeLabel { position: absolute; top: 0px; left: 12px; font-size: 1.5rem; color: #616161; }

/* Chart */
html, body { height: 100%; margin: 0; padding: 0; }
#chart_div { width: 100%; height: 70vh; }

/* Offcanvas */
.offcanvas { background-color: #1E1E1E; }
.offcanvas-header { background-color: #353535; color: white; }
.offcanvas-body { font-size: 21px; color: #FFFFFF; }
.offcanvasCard-header { border-bottom: none; }
.offcanvasCard { background-color: #1E1E1E; border: none; color: #FFFFFF; }
.offcanvas-body a { color: #616161; text-decoration: none; }
.offcanvas-body a:hover { color: #BABABA; }
.offcanvas-body ul li { margin-bottom: 10px; }
.btn-close { color: #1E1E1E; background-color: #FFFFFF; }
.btn-close:hover { color: #353535; }
.btn-close:focus { box-shadow: none; }
.list-unstyled li a { padding-left: 50px; position: relative; }
.list-unstyled li a i { position: absolute; left: 10px; }

/* Hamburger + Sprache */
.buttonOffcanvas, .sprache, .sprache_active { display: inline-block; vertical-align: middle; }
.buttonOffcanvas { background-color: #1E1E1E; border: 1px solid #1E1E1E !important; color: #353535; margin: 10px; }
.buttonOffcanvas i { color: #BABABA; }
.buttonOffcanvas:hover { background-color: #353535 !important; border: 1px solid #1E1E1E !important; }
.buttonOffcanvas:active { background-color: #353535; }
.buttonOffcanvas:focus { outline: #FFFFFF; }

.trenner { color: #353535; }
.sprache:link, .sprache:visited { color: #353535; text-decoration: none; }
.sprache:hover, .sprache:active { color: #BABABA; text-decoration: none; }
.sprache_active:link, .sprache_active:visited, .sprache_active:hover, .sprache_active:active { color: #BABABA; text-decoration: none; }

/* Impressum */
.impressum { color: #BABABA; }
.impressum_link:link, .impressum_link:visited, .impressum_link:active { color: #BABABA; }
.impressum_link:hover { color: #FFFFFF; }