/**
 * Fix a bootstrap bug that adds padding when open a modal when a scrollbar is already present.
 * https://stackoverflow.com/questions/32862394/bootstrap-modals-keep-adding-padding-right-to-body-after-closed
 */
.modal-open {
    padding-right: 0px !important;
}
header {
    padding-right: 0px !important;
}
/**
 * Avoid unclosed HTML-tag "<main>" in Django-template-tags "breadcrumbs" and "content" by putting #main css function
 * into breadcrumbs class.
 */
.breadcrumbs {
    margin-top: 80px;
}
/**
 * Shrink margin to entry below in search results
 */
.catalog .entry {
    margin-bottom: 20px !important;
}

/**
* shrink margin between metadata icon and content
*/
.catalog .entry .entry-meta i {
    margin-right: 4px !important;
}

/**
* decrease the padding a bit to stay as compact as possible
*/
.catalog ul li {
  padding-bottom: 4px !important;
}

#header {
    background: rgb(var(--prim-color)) !important;
}
#header.header-scrolled {
    background: rgba(var(--prim-color), 0.8) !important;
}
/**
 * Make searchbox larger and more sensible
 */
#header .searchbox {
    min-width: 50% !important;
    margin-left: 10px;
}
.breadcrumbs {
    background-color: rgb(var(--sec-color)) !important;
}
.form-check-input:checked {
    background-color: rgb(var(--tert-color));
    border-color: rgb(var(--tert-color));
}
.form-check-input {
    background-color: rgb(var(--tert-color));
    border-color: rgb(var(--tert-color));
}
#header .form-check-input:checked {
    background-color: rgb(var(--sec-color));
    border-color: rgb(var(--sec-color));
}
#header .form-check-input {
    background-color: rgb(var(--sec-color));
    border-color: rgb(var(--sec-color));
}
.form-check-input:focus {
    border-color: rgb(var(--foot-two));
    box-shadow: 0 0 0 .25rem rgba(var(--foot-two), .25);
}
.bg-report-headline {
	background-color: rgb(var(--sec-color));
}
.back-to-top {
    background: rgb(var(--tert-color));
}
.back-to-top:hover {
    background: rgb(var(--tert-color));
    filter: brightness(200%);
}
/**
 * Colorize the intention switch button knob
 */
#header .form-switch .form-check-input {
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%231e4356'/%3e%3c/svg%3e");
}
#header .form-switch .form-check-input:checked {
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23423347'/%3e%3c/svg%3e");
}
/**
 * Different sizings for icon font
 */
.icon-2em {
    font-size: 2em !important;
}
.icon-1_8em {
    font-size: 1.8em !important;
}
.icon-1_5em {
    font-size: 1.5em !important;
}
.icon-1_2em {
    font-size: 1.2em !important;
}
.icon-1em {
    font-size: 1em !important;
}
/**
 * Fix clipboard counter position in mobile navigation bar.
 */
.navbar-mobile span {
    left: 6% !important;
}
.navbar-mobile li {
    margin-bottom: 10px;
}
/**
 * Change default values of various elements to enable the two therapy intention colorschemes.
 */
a {
    color: rgb(var(--link-color));
}
a:hover:not(.btn) {
    color: rgb(var(--link-color));
    filter: brightness(115%);
}
.navbar a:hover, .navbar li:hover > a {
    color: rgb(var(--tert-color)) !important;
}
.section-title h2::after {
    background: rgb(var(--tert-color));
}
.section-bg {
    background-color: rgb(var(--sec-color));
}
.facts .counters span {
    color: rgb(var(--tert-color));
}
.accordion-button:focus {
    box-shadow: var(--accordion-box-shadow);
}
.btn-primary {
    background: rgb(var(--prim-color));
    border-color: rgb(var(--prim-color));
    --bs-btn-active-bg: rgb(var(--foot-one));
    --bs-btn-active-border-color: rgb(var(--foot-one));
}
.btn-primary:hover , .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    background: rgb(var(--prim-color));
    border-color: rgb(var(--prim-color));
    filter: brightness(130%);
}
.catalog ul i {
    color: rgb(var(--link-color));
}
#hero .btn-get-started {
    border: 2px solid rgb(var(--link-color));
}
#hero .btn-get-started:hover {
    background: rgb(var(--link-color));
}
#footer {
    background: rgb(var(--foot-two));
}
#footer .footer-top {
    background: rgb(var(--foot-one));
    border-top: 1px solid rgb(var(--foot-border));
    border-bottom: 1px solid rgb(var(--foot-border));
}
#footer .footer-top h4 {
    color: rgb(var(--tert-color));
}
#footer .footer-top .footer-links ul i {
    color: rgb(var(--tert-color)) !important;
}
#footer .footer-top .footer-links ul a:hover {
    color: rgb(var(--tert-color)) !important;
}
/**
 * Overwrite dl width to have 40px more for dt columns and 40px less for dd columns.
 * That should support long identifiers in variant details page.
 */
@media (min-width: 1024px) {
    .dl-horizontal dt {
        float: left;
        width: 340px;
        clear: left;
        text-align: left;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .dl-horizontal dd {
        margin-left: 370px;
    }
}
[data-theme="palliative"] {
	--prim-color: 58,143,175;
	--sec-color: 238,250,255;
	--tert-color: 104,164,196;
	--foot-one: 21,64,87;
	--foot-two: 15,47,64;
	--foot-border: 18,54,73;
	--link-color: 79,166,213;
	--accordion-box-shadow: 0 0 0 0.25rem rgba(var(--tert-color),0.25);
	--bs-primary-bg-subtle: rgb(var(--tert-color)) !important;
	--bs-primary-text-emphasis: rgb(var(--foot-two)) !important;
}
[data-theme="curative"] {
	--prim-color: 86,66,92;
	--sec-color: 241,243,255;
	--tert-color: 132,97,143;
	--foot-one: 35,31,45;
	--foot-two: 21,18,26;
	--foot-border: 60,52,79;
	--link-color: 112,102,141;
	--accordion-box-shadow: 0 0 0 0.25rem rgba(var(--tert-color),0.25);
	--bs-primary-bg-subtle: rgb(var(--tert-color)) !important;
	--bs-primary-text-emphasis: rgb(var(--foot-two)) !important;
}