@font-face {
	font-family: "Inter";
	font-display: swap;
	font-weight: 100 900;
	src: url("/static/fonts/inter.woff2") format('woff2-variations');
}

[data-bs-theme=light] {
	--bs-basic-btn-hover-bg: color-mix(in srgb, var(--bs-body-bg) 95%, black);
	--bs-basic-btn-hover-bg-strong: color-mix(in srgb, var(--bs-body-bg) 90%, black);
	--bs-basic-btn-active-bg: color-mix(in srgb, var(--bs-body-bg) 92%, black);
	--bs-basic-btn-active-bg-strong: color-mix(in srgb, var(--bs-body-bg) 87%, black);
}

[data-bs-theme=dark] {
	--bs-basic-btn-hover-bg:color-mix(in srgb, var(--bs-body-bg) 95%, white);
	--bs-basic-btn-hover-bg-strong: color-mix(in srgb, var(--bs-body-bg) 90%, white);
	--bs-basic-btn-active-bg: color-mix(in srgb, var(--bs-body-bg) 92%, white);
	--bs-basic-btn-active-bg-strong: color-mix(in srgb, var(--bs-body-bg) 87%, white);
}

:root {
	--bs-font-sans-serif: "Inter", sans-serif;
	--bs-heading-font-weight: 600;
}

.tagify {
	--tags-disabled-bg: var(--bs-secondary-bg);
	--tags-border-color: var(--bs-border-color);
	--tags-hover-border-color: var(--bs-secondary);
	--tags-focus-border-color: var(--bs-primary);
	--tag-border-radius: var(--bs-border-radius);
	--tag-bg: var(--bs-tertiary-bg);
	--tag-hover: var(--bs-gray-bg-subtle);
	--tag-text-color: var(--bs-body-color);
	--tag-text-color--edit: var(--bs-body-color);
	--tag-pad: 0.25em 0.5em;
	--tag-inset-shadow-size: 1.2em;
	--tag-invalid-color: var(--bs-danger-text-emphasis);
	--tag-invalid-bg: var(--bs-danger-bg-subtle);
	--tag--min-width: 1ch;
	--tag--max-width: 100%;
	--tag-hide-transition: 0.3s;
	--tag-remove-bg: var(--bs-danger-bg-subtle);
	--tag-remove-btn-color: var(--bs-danger-text-emphasis);
	--tag-remove-btn-bg: none;
	--tag-remove-btn-bg--hover: var(--bs-danger);
	--tagify-dd-bg-color: var(--bs-tertiary-bg);
	--input-color: var(--bs-body-color);
	--placeholder-color: var(--bs-secondary-color);
	--placeholder-color-focus: var(--bs-tertiary-color);
	--loader-size: 0.8em;
	--readonly-striped: 1;
}

/* use bootstrap colors for the chart */
:root {
    --chart-color-1: var(--bs-primary);
    --chart-color-2: var(--bs-success);
    --chart-color-3: var(--bs-danger);
    --chart-color-4: var(--bs-warning);
    --chart-color-5: var(--bs-info);
    --chart-color-6: var(--bs-indigo);
    --chart-color-7: var(--bs-pink);

    --chart-grid-color: var(--bs-border-color-translucent);
    --chart-text-color: var(--bs-secondary-color);
    --chart-tooltip-bg: var(--bs-tertiary-bg);
    --chart-tooltip-border: var(--bs-border-color);
    --chart-tooltip-text: var(--bs-body-color);
}

[data-bs-theme="dark"] {
    --chart-grid-color: var(--bs-border-color-translucent);
    --chart-text-color: var(--bs-secondary-color);
    --chart-tooltip-bg: var(--bs-tertiary-bg);
    --chart-tooltip-border: var(--bs-border-color);
    --chart-tooltip-text: var(--bs-body-color);
}

.tags-look .tagify__dropdown__item{
	display: inline-block;
	border-radius: 3px;
	padding: .3em .5em;
	border: 1px solid #CCC;
	background: #F3F3F3;
	margin: .2em;
	font-size: .85em;
	color: black;
	transition: 0s;
}

.tags-look .tagify__dropdown__item--active{
	color: black;
}

.tags-look .tagify__dropdown__item:hover{
	background: lightyellow;
	border-color: gold;
}


.accordion {
	--bs-accordion-btn-focus-box-shadow: none;
}

.dropdown-toggle::after {
	content: '\E136';
	font-family: Phosphor;
	font-size: .75rem;
/*	color: var(--bs-body-color);*/
	font-weight: bold;
	vertical-align: unset;
	border-top: 0;
	border-right: 0;
	border-left: 0;
}

.dropdown-menu {
	--bs-dropdown-min-width: 8.25rem;
}

footer .icon-link .ph {
	font-size: 24px;
}
footer .icon-link {
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.btn-basic {
	color: var(--bs-body-color);
}

.btn-basic:hover, .btn-basic:focus {
	background-color: var(--bs-basic-btn-hover-bg);
}
.btn-basic:active {
	background-color: var(--bs-basic-btn-active-bg) !important;
}
.btn-basic:hover, .btn-basic:focus, .btn-basic:active {
	color: var(--bs-body-color) !important;
	border-color: transparent !important;
}

.btn {
	transition: .2s;
}

.form-control-lg {
	padding: .7em 1em;
	font-size: var(--bs-body-font-size);
}

th[aria-sort] {
	background-color: var(--bs-tertiary-bg);
	border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
}

.navbar {
	background-color: var(--bs-content-bg);
	border-bottom: var(--bs-border-width) solid var(--bs-content-border-color);
}

.alert .btn-close {
	margin-right: .25rem;
}

.form-control::placeholder {
	color: hsl(215.1, 21.3%, 48.8%);
}

.form-group-icon label {
	padding: .5em .6em;
	cursor: text;
}

.form-group-icon input {
	padding-inline: 2.5em;
}

input:autofill {
	border-color: transparent;
}