.bootstrap-table .table > tbody > tr.group-by.expanded,
.bootstrap-table .table > tbody > tr.group-by.collapsed {
  cursor: pointer;
}
.bootstrap-table .table > tbody > tr.hidden {
  display: none;
}

.bootstrap-table .table > tbody > tr.group-by {
  text-align: center;
  font-weight: bold;
  border-top: 1px solid currentColor;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.bootstrap-table .table > tbody > td {
    vertical-align: middle;
}
.bootstrap-table .fixed-table-container .table thead th .sortable {
  cursor: pointer;
  background-position: right;
  background-repeat: no-repeat;
  padding-right: 15px !important;
}
.bootstrap-table .pagination li > a {
    border-radius: 0.1rem !important;
}

.grusher_heartbeat {
    animation: grusher_heartbeat 1.3s infinite ease-in-out;
    transform-origin: center;
}

@keyframes grusher_heartbeat {
    0%   { transform: scale(1); }
    15%  { transform: scale(1.18); }
    30%  { transform: scale(0.92); }
    45%  { transform: scale(1.12); }
    60%  { transform: scale(0.98); }
    100% { transform: scale(1); }
}

.grusher_blink_low {
  animation: grusher_blink_low_keyframes 2s cubic-bezier(.46,.03,.52,.96) infinite;
  display: inline-block;
}
.grusher_blink_medium {
  animation: grusher_blink_low_keyframes 3s linear infinite;
  display: inline-block;
}
.grusher_blink_high {
  animation: grusher_blink_low_keyframes 1s linear infinite;
  display: inline-block;
}
.grusher_blink_low, .grusher_blink_medium, .grusher_blink_high {
  filter: drop-shadow(0 0 2px rgba(0,0,0,0.2));
}
@keyframes grusher_blink_low_keyframes{
  50% { opacity: 0.5; }
}

.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
/* Плавний hover та фокус */
.form-check-input {
    transition: all 0.25s ease;
    cursor: pointer;
}

/* Злегка збільшуємо при наведенні */
.form-check-input:hover {
    transform: scale(1.25);
}

/* Підсвічування при фокусі */
.form-check-input:focus {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}


/* Мʼякий перехід для тексту */
.form-check-label {
    transition: color 0.25s ease;
}

.text-bold{
	/*font-weight: 500;*/
	font-weight: 600;
}

a:link {
  outline: none;
  text-decoration: none;
}
body{
	/*font-size: 13px !important;*/
	font-family: 'Noto Sans';
}

img.rot {
  animation: .5s linear 0s normal none infinite running rot;
  -webkit-animation: .5s linear 0s normal none infinite running rot;
  width: 100px;
}
input {
    border-radius: 2px;
}
pre {
    font-size: 1em;
}

tbody > tr > td> a {
    border-bottom: 1px dashed;
}
tbody > tr .primary > td > a {
  border-bottom: 1px dashed;
}
.accordion{
	margin-bottom: 10px;
}
.accordion-button:not(.collapsed) {
  background-color: transparent !important;
  color: var(--bs-primary);
  font-weight: 500;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.05);
}
.accordion-button {
  padding: 0.5rem 0.5rem;
  font-size: 0.9rem;
  border-radius: 3px;
  transition: all 0.2s ease-in-out;
}
.accordion-item:last-of-type {
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
.accordion-item:first-of-type {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.accordion .accordion-item {
    border: 1px solid color-mix(in srgb, currentColor 10%, transparent);
    overflow: hidden;
    box-shadow: 0 6px 16px rgba(0,0,0,0.05);
}
.accordion .accordion-item:hover {
    box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}
.accordion-item {
    overflow: visible !important;
}



.alert-xs{
	padding: 5px;
}
.alert-sm{
	padding: 10px;
}
.alert-very-danger{
	color: #fff;
	background-color: red;
	border-color: #b02a37;
}
.add-gradient{
	background-image: var(--bs-gradient) !important;
}
.badge{
	background-image: var(--bs-gradient) !important;
	border-radius: 3px !important;
}
.badge-block{
	width:100%;
}
.badge-gv{
	white-space: break-spaces;
}
.badge{
	font-size: 0.85em;
}
.blink {
  animation-name: blinker;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(1.0,0,0,1.0);
  animation-duration: 2s;
  -webkit-animation-name: blinker;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
  -webkit-animation-duration: 1s;
  color:white;
}
.blink-green{
	background:green;
	color:white;
}
.blink-red{
	background: var(--bs-danger);
	color:white;
}
.blink-orange{
	background:var(--bs-warning);
	color:white;
}
.pulse-icon{
  background: black;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
  /*margin: 5px;*/
  height: 10px;
  width: 10px;
  transform: scale(1);
  animation: pulse-black 2s infinite;
  display: inline-block;	
}
.pulse-icon.green {
  background: rgba(51, 217, 178, 1);
  box-shadow: 0 0 0 0 rgba(51, 217, 178, 1);
  animation: pulse-green 2s infinite;
}

.blob {
  background: black;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
  /*margin: 5px;*/
  height: 10px;
  width: 10px;
  transform: scale(1);
  animation: pulse-black 2s infinite;
  display: inline-block;
}

.blob.green {
  background: rgba(51, 217, 178, 1);
  box-shadow: 0 0 0 0 rgba(51, 217, 178, 1);
  animation: pulse-green 2s infinite;
}
 .dropend:hover > .dropdown-menu {
    left: 98% !important;
}
.dropend .dropdown-menu[data-bs-popper]{
	left: 98% !important;
}
.btn{
  border-radius: 3px;
  font-weight: 500;
  transition: all 0.25s ease;
  /*border-color: color-mix(in srgb, currentColor 40%, transparent) !important;*/
}
.btn.btn-left-text[style*="border-left"] {
    border-top-color: color-mix(in srgb, currentColor 30%, transparent) !important;
    border-bottom-color: color-mix(in srgb, currentColor 30%, transparent) !important;
	border-right-color: color-mix(in srgb, currentColor 30%, transparent) !important;
}
.btn-block {
    width: 100%;
}
.btn-left-text {
    text-align: left !important;
}
.btn-xs, .btn-group-xs > .btn {
    padding: 0.125rem 0.35rem !important;
	font-size: 0.8rem !important;
	line-height: 1.5 !important;
	margin: 1px;
}
.btn:hover{
  /*transform: translateY(-1px);*/
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.btn:active {
  /*transform: translateY(0);*/
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.btn-group-sm > .btn, .btn-sm {
    border-radius: 2px;
}
.btn-sm {
    padding: 0.2rem 0.2rem;
    margin-bottom: 3px;
    border-radius: 2px;
}
.btn-outline-default{
	--bs-btn-color: #6c757d;
	--bs-btn-border-color: #6c757d;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #6c757d;
	--bs-btn-hover-border-color: #6c757d;
	--bs-btn-focus-shadow-rgb: 108,117,125;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #6c757d;
	--bs-btn-active-border-color: #6c757d;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #6c757d;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #6c757d;
	--bs-gradient: none;
	border: unset;
}
.btn-default {
  --bs-btn-color: #fff;
  --bs-btn-bg: #6c757d;
  --bs-btn-border-color: #6c757d;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #5c636a;
  --bs-btn-hover-border-color: #565e64;
  --bs-btn-focus-shadow-rgb: 130,138,145;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #565e64;
  --bs-btn-active-border-color: #51585e;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #6c757d;
  --bs-btn-disabled-border-color: #6c757d;
}
.card {
  border-radius: 3px;
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
.card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
}
.card-header{
	border-bottom: 1px solid color-mix(in srgb, currentColor 10%, transparent);
}
.card-header h6 {
    font-weight: 600;
}
.card-footer{
	border-top: 1px solid color-mix(in srgb, currentColor 10%, transparent);
}
.card-text{
	font-size:13px;
}
.card-header:first-child {
  border-radius: 3px 3px 0 0 !important;
}
.color-green {
    color: var(--bs-success);
    font-weight: 600;
}.color-orange {
    color: var(--bs-warning);
    font-weight: 600;
}.color-red {
    color: var(--bs-danger);
    font-weight: 600;
}
.dropdown-menu {
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
.dropdown-item {
    font-size: 12px;
}

.input-group .form-control, .input-group .form-select {
    border-radius: 0;
    box-shadow: inset 0 0 6px rgba(0,123,255,0.1);
}


.form-control {
    border-radius: 2px;
}
.form-control-xs {
  min-height: calc(1.5em + 2px);
  padding: .1rem .3rem;
  font-size: .775rem;
  border-radius: .2rem;
}
.form-select, .form-select-sm, .form-select-xs {
	border-radius: 2px;
}
.form-select-xs {
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
  padding-left: 0.35rem;
  font-size: 0.675rem;
}
.filter-control > .form-select{
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
	padding-left: 0.5rem;
	font-size: 0.875rem;
	border-radius: 2px;
}
.hr-sm{
	margin: 0.5rem 0;
}
.input-group-text {
	border-radius: 3px !important;
	border: none;
	font-weight: 500;
	background: transparent;
}
.input-group-sm > .btn, .input-group-sm > .form-control, .input-group-sm > .form-select, .input-group-sm > .input-group-text {
  font-size: .775rem;
  border-radius: 3px !important;
}

.input-group-text-unset{
	background-color: unset !important;
	border: unset !important;
}
.input-group-text-border-radius-unset{
	border-radius: 3px !important;
}
.link-dashed {
    border-bottom: 1px dashed;
    /*font-weight:600;*/
}
.list-group-horizontal > .list-group-item:last-child {
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
.list-group-horizontal > .list-group-item:first-child {
  border-bottom-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.list-group-item:first-child {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.list-group-item:last-child {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}
.list-group-sm li{
	padding: 5px !important;
}
.list-group-item{
	font-size:12px !important;
}
.list-group-item{
	padding: 0.5rem 0.75rem;
	/*font-size: 13px;*/
}
.max-z-index{
	z-index: 222222222 !important;
}
.modal-content {
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0,0,0,0.2);
}
.modal-header {
  border-radius: 2px;
  color: white;
  background: linear-gradient(90deg, #395897, #99bf30);
  border-bottom: none;
}
.modal-dialog-lg{
	width: auto;max-width: 1200px;
}
.navbar {
    padding: 0.1rem 0.5rem;
    font-size: 14px;
    position: relative;
    z-index: 1030;
}
.navbar .dropdown-menu,
.navbar-nav .dropdown-menu {
    z-index: 1035;
}

.no-border{
	border-radius: 0em;
	border: none;
}
.gr-port-num{
	background: transparent;
	user-select: none;
	pointer-events: none;
}
.offcanvas-start {
  width: 500px !important;
}
.pagination-block nav {
	justify-content: center !important;
	display: flex !important;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
}
.pagination-block nav ul{
	flex-wrap: wrap !important;
	display: flex;
	padding-left: 0;
	list-style: none;
	margin-top: 0;
	margin-bottom: 1rem;
}
.pagination-block nav ul li a {
	  position: relative;
	  display: block;
	  text-decoration: none;
	  padding: 0.25rem 0.5rem;
	  font-size: 0.875rem;
}

.pagination-block nav ul li.disabled {
	z-index: 3;
	padding: 0.25rem 0.5rem;
	
}
.pagination-block nav ul li.active {
	z-index: 3;
	padding: 0.25rem 0.5rem;
}
.pagination-block nav ul li.disabled {
	z-index: 3;
	padding: 0.25rem 0.5rem;
}
.progress {
  border-radius: 3px !important;
}
.pointer{
	cursor:pointer;
}
.port-up, .port-down, .port-unk, .port-10, .port-100, .port-1000, .port-more1000 {
	transition: all 0.3s ease;
}
.port-up{border-left: 5px solid #10b981 !important; color: #10b981 !important; font-weight:600;}
.port-up button {color: #10b981 !important; font-weight:600;}
.port-down{border-left: 5px solid #ef4444 !important; color: #ef4444 !important; font-weight:600;}
.port-down button {color: #ef4444 !important; font-weight:600;}
.port-unk{border-left: 5px solid grey !important;color: grey !important;font-weight:600;}
.port-10{border-left: 5px solid #f59e0b !important;color:#f59e0b !important;font-weight:600;}
.port-100{border-left: 5px solid #10b981 !important;color:#10b981 !important;font-weight:#10b981;}
.port-1000{border-left: 5px solid #3b82f6 !important;color:#3b82f6 !important;font-weight:600;}
.port-more1000{border-left: 5px solid #8b5cf6 !important;color:#8b5cf6 !important;font-weight:600;}
.port-error-count{color:#ef4444 !important;}


.pseudo{
	position: absolute;
	top: -2px;
	right: 0;
	font-size: 10px;
	cursor:pointer;
	z-index: 1;
	color: blue;
}
.row-flex {
  display: flex;
  flex-wrap: wrap;
}
.row-flex-content {
  height: 100%;
}
.select2 {
    width: 100% !important;
}
.select2-container--default .select2-selection--multiple {
  border-radius: 3px !important;
  border: 1px solid #e8ebed;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
  border-radius: 3px !important;
}
.select2-container--default .select2-results > .select2-results__options{
	padding: 5px;
}
.select2-container--default .select2-selection--multiple {
  background-color: unset !important;
  border-radius: 3px !important;
}
.select2-selection--multiple .select2-selection__choice {
  background-color: unset !important;
  border-radius: 3px !important;
}
.select2-container--default .select2-selection--single {
    /*background-color: #fff !important;*/
    border: 1px solid #dee2e6;
    border-radius: 3px !important;
    transition: border-color 0.2s;
    /*height: 31px !important;*/
}
.select2-results__option {
    padding: 3px !important;
    font-size: 12px !important;
}
.select2-container--default .select2-selection--single:hover {
  border-color: var(--bs-primary);
}
.signal-red{
	color:#ff6347;
}
.spinner-border-xs {
  --bs-spinner-width: 0.75rem;
  --bs-spinner-height: 0.75rem;
  --bs-spinner-border-width: 0.2em;
}
.text-bg-success-light{
	background-color: #53a54a !important;
	color: white;
}
.text-bg-danger-light{
	background-color: #ef2f5a !important;
	color: white;
}
.text-muted{
	font-size:12px;
}
.vcentr{
	vertical-align: none;
	text-align: center;
}
.vertical{
  -webkit-transform: rotate(-90deg); 
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.very-danger{
	color: #fff;
	background-color: red;
	border-color: #b02a37;
}
[type="search"] {
    font-size: 12px;
}

@keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes blinker {
  from { opacity: 1.0;}
  to { opacity: 0.0;}
   from { opacity: 0.0;}
  to { opacity: 1.0;}
}
 
@-webkit-keyframes blinker {
  from { opacity: 1.0; color:black;}
  to { opacity: 0.0; color:black;}
}
@keyframes pulse-black {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
}
.blob.white {
  background: white;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
  animation: pulse-white 2s infinite;
}
@keyframes pulse-white {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
.blob.red {
  background: rgba(255, 82, 82, 1);
  box-shadow: 0 0 0 0 rgba(255, 82, 82, 1);
  animation: pulse-red 2s infinite;
}
.blob.green {
  background: rgb(25, 135, 84);
  box-shadow: 0 0 0 0 rgb(25, 135, 84);
  animation: pulse-green 2s infinite;
}
@keyframes pulse-red {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 82, 82, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(255, 82, 82, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 82, 82, 0);
  }
}
@keyframes pulse-green {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(25, 135, 84, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(25, 135, 84, 0);
  }
}
.blob.orange {
  background: rgba(255, 121, 63, 1);
  box-shadow: 0 0 0 0 rgba(255, 121, 63, 1);
  animation: pulse-orange 2s infinite;
}
@keyframes pulse-orange {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 121, 63, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(255, 121, 63, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 121, 63, 0);
  }
}
.blob.yellow {
  background: rgba(255, 177, 66, 1);
  box-shadow: 0 0 0 0 rgba(255, 177, 66, 1);
  animation: pulse-yellow 2s infinite;
}
@keyframes pulse-yellow {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 177, 66, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(255, 177, 66, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 177, 66, 0);
  }
}
.blob.blue {
  background: rgba(52, 172, 224, 1);
  box-shadow: 0 0 0 0 rgba(52, 172, 224, 1);
  animation: pulse-blue 2s infinite;
}
@keyframes pulse-blue {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(52, 172, 224, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(52, 172, 224, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(52, 172, 224, 0);
  }
}
@keyframes pulse-green {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(51, 217, 178, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(51, 217, 178, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(51, 217, 178, 0);
  }
}
.blob.purple {
  background: rgba(142, 68, 173, 1);
  box-shadow: 0 0 0 0 rgba(142, 68, 173, 1);
  animation: pulse-purple 2s infinite;
}
@keyframes pulse-purple {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(142, 68, 173, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(142, 68, 173, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(142, 68, 173, 0);
  }
}

[data-bs-theme=cosmo] {
  --bs-blue: #2780e3;
  --bs-indigo: #6610f2;
  --bs-purple: #613d7c;
  --bs-pink: #e83e8c;
  --bs-red: #ff0039;
  --bs-orange: #f0ad4e;
  --bs-yellow: #ff7518;
  --bs-green: #3fb618;
  --bs-teal: #20c997;
  --bs-cyan: #9954bb;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #868e96;
  --bs-gray-dark: #373a3c;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #868e96;
  --bs-gray-700: #495057;
  --bs-gray-800: #373a3c;
  --bs-gray-900: #212529;
  --bs-primary: #2780e3;
  --bs-secondary: #373a3c;
  --bs-success: #3fb618;
  --bs-info: #9954bb;
  --bs-warning: #ff7518;
  --bs-danger: #ff0039;
  --bs-light: #f8f9fa;
  --bs-dark: #373a3c;
  --bs-primary-rgb: 39, 128, 227;
  --bs-secondary-rgb: 55, 58, 60;
  --bs-success-rgb: 63, 182, 24;
  --bs-info-rgb: 153, 84, 187;
  --bs-warning-rgb: 255, 117, 24;
  --bs-danger-rgb: 255, 0, 57;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 55, 58, 60;
  --bs-primary-text-emphasis: #10335b;
  --bs-secondary-text-emphasis: #161718;
  --bs-success-text-emphasis: #19490a;
  --bs-info-text-emphasis: #3d224b;
  --bs-warning-text-emphasis: #662f0a;
  --bs-danger-text-emphasis: #660017;
  --bs-light-text-emphasis: #495057;
  --bs-dark-text-emphasis: #495057;
  --bs-primary-bg-subtle: #d4e6f9;
  --bs-secondary-bg-subtle: #d7d8d8;
  --bs-success-bg-subtle: #d9f0d1;
  --bs-info-bg-subtle: #ebddf1;
  --bs-warning-bg-subtle: #ffe3d1;
  --bs-danger-bg-subtle: #ffccd7;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #ced4da;
  --bs-primary-border-subtle: #a9ccf4;
  --bs-secondary-border-subtle: #afb0b1;
  --bs-success-border-subtle: #b2e2a3;
  --bs-info-border-subtle: #d6bbe4;
  --bs-warning-border-subtle: #ffc8a3;
  --bs-danger-border-subtle: #ff99b0;
  --bs-light-border-subtle: #e9ecef;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #373a3c;
  --bs-body-color-rgb: 55, 58, 60;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(55, 58, 60, 0.75);
  --bs-secondary-color-rgb: 55, 58, 60;
  --bs-secondary-bg: #e9ecef;
  --bs-secondary-bg-rgb: 233, 236, 239;
  --bs-tertiary-color: rgba(55, 58, 60, 0.5);
  --bs-tertiary-color-rgb: 55, 58, 60;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #2780e3;
  --bs-link-color-rgb: 39, 128, 227;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #1f66b6;
  --bs-link-hover-color-rgb: 31, 102, 182;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #373a3c;
  --bs-highlight-bg: #ffe3d1;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(39, 128, 227, 0.25);
  --bs-form-valid-color: #3fb618;
  --bs-form-valid-border-color: #3fb618;
  --bs-form-invalid-color: #ff0039;
  --bs-form-invalid-border-color: #ff0039;
}
[data-bs-theme=pulse] {
  --bs-blue: #007bff;
  --bs-indigo: #6610f2;
  --bs-purple: #593196;
  --bs-pink: #e83e8c;
  --bs-red: #fc3939;
  --bs-orange: #fd7e14;
  --bs-yellow: #efa31d;
  --bs-green: #13b955;
  --bs-teal: #20c997;
  --bs-cyan: #009cdc;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #868e96;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #fafafa;
  --bs-gray-200: #f9f8fc;
  --bs-gray-300: #ededed;
  --bs-gray-400: #cbc8d0;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #868e96;
  --bs-gray-700: #444;
  --bs-gray-800: #343a40;
  --bs-gray-900: #17141f;
  --bs-primary: #593196;
  --bs-secondary: #a991d4;
  --bs-success: #13b955;
  --bs-info: #009cdc;
  --bs-warning: #efa31d;
  --bs-danger: #fc3939;
  --bs-light: #f9f8fc;
  --bs-dark: #17141f;
  --bs-primary-rgb: 89, 49, 150;
  --bs-secondary-rgb: 169, 145, 212;
  --bs-success-rgb: 19, 185, 85;
  --bs-info-rgb: 0, 156, 220;
  --bs-warning-rgb: 239, 163, 29;
  --bs-danger-rgb: 252, 57, 57;
  --bs-light-rgb: 249, 248, 252;
  --bs-dark-rgb: 23, 20, 31;
  --bs-primary-text-emphasis: #24143c;
  --bs-secondary-text-emphasis: #443a55;
  --bs-success-text-emphasis: #084a22;
  --bs-info-text-emphasis: #003e58;
  --bs-warning-text-emphasis: #60410c;
  --bs-danger-text-emphasis: #651717;
  --bs-light-text-emphasis: #444;
  --bs-dark-text-emphasis: #444;
  --bs-primary-bg-subtle: #ded6ea;
  --bs-secondary-bg-subtle: #eee9f6;
  --bs-success-bg-subtle: #d0f1dd;
  --bs-info-bg-subtle: #ccebf8;
  --bs-warning-bg-subtle: #fcedd2;
  --bs-danger-bg-subtle: #fed7d7;
  --bs-light-bg-subtle: #fdfdfd;
  --bs-dark-bg-subtle: #cbc8d0;
  --bs-primary-border-subtle: #bdadd5;
  --bs-secondary-border-subtle: #ddd3ee;
  --bs-success-border-subtle: #a1e3bb;
  --bs-info-border-subtle: #99d7f1;
  --bs-warning-border-subtle: #f9daa5;
  --bs-danger-border-subtle: #feb0b0;
  --bs-light-border-subtle: #f9f8fc;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #444;
  --bs-body-color-rgb: 68, 68, 68;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(68, 68, 68, 0.75);
  --bs-secondary-color-rgb: 68, 68, 68;
  --bs-secondary-bg: #f9f8fc;
  --bs-secondary-bg-rgb: 249, 248, 252;
  --bs-tertiary-color: rgba(68, 68, 68, 0.5);
  --bs-tertiary-color-rgb: 68, 68, 68;
  --bs-tertiary-bg: #fafafa;
  --bs-tertiary-bg-rgb: 250, 250, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #593196;
  --bs-link-color-rgb: 89, 49, 150;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #593196;
  --bs-link-hover-color-rgb: 89, 49, 150;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #444;
  --bs-highlight-bg: #fcedd2;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #ededed;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(89, 49, 150, 0.25);
  --bs-form-valid-color: #13b955;
  --bs-form-valid-border-color: #13b955;
  --bs-form-invalid-color: #fc3939;
  --bs-form-invalid-border-color: #fc3939;
}

[data-bs-theme=yeti] {
  --bs-blue: #008cba;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #e83e8c;
  --bs-red: #f04124;
  --bs-orange: #fd7e14;
  --bs-yellow: #e99002;
  --bs-green: #43ac6a;
  --bs-teal: #20c997;
  --bs-cyan: #5bc0de;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #888;
  --bs-gray-dark: #333;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #eee;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ccc;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #888;
  --bs-gray-700: #495057;
  --bs-gray-800: #333;
  --bs-gray-900: #222;
  --bs-primary: #008cba;
  --bs-secondary: #eee;
  --bs-success: #43ac6a;
  --bs-info: #5bc0de;
  --bs-warning: #e99002;
  --bs-danger: #f04124;
  --bs-light: #eee;
  --bs-dark: #333;
  --bs-primary-rgb: 0, 140, 186;
  --bs-secondary-rgb: 238, 238, 238;
  --bs-success-rgb: 67, 172, 106;
  --bs-info-rgb: 91, 192, 222;
  --bs-warning-rgb: 233, 144, 2;
  --bs-danger-rgb: 240, 65, 36;
  --bs-light-rgb: 238, 238, 238;
  --bs-dark-rgb: 51, 51, 51;
  --bs-primary-text-emphasis: #00384a;
  --bs-secondary-text-emphasis: #5f5f5f;
  --bs-success-text-emphasis: #1b452a;
  --bs-info-text-emphasis: #244d59;
  --bs-warning-text-emphasis: #5d3a01;
  --bs-danger-text-emphasis: #601a0e;
  --bs-light-text-emphasis: #495057;
  --bs-dark-text-emphasis: #495057;
  --bs-primary-bg-subtle: #cce8f1;
  --bs-secondary-bg-subtle: #fcfcfc;
  --bs-success-bg-subtle: #d9eee1;
  --bs-info-bg-subtle: #def2f8;
  --bs-warning-bg-subtle: #fbe9cc;
  --bs-danger-bg-subtle: #fcd9d3;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #ccc;
  --bs-primary-border-subtle: #99d1e3;
  --bs-secondary-border-subtle: #f8f8f8;
  --bs-success-border-subtle: #b4dec3;
  --bs-info-border-subtle: #bde6f2;
  --bs-warning-border-subtle: #f6d39a;
  --bs-danger-border-subtle: #f9b3a7;
  --bs-light-border-subtle: #eee;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #222;
  --bs-body-color-rgb: 34, 34, 34;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(34, 34, 34, 0.75);
  --bs-secondary-color-rgb: 34, 34, 34;
  --bs-secondary-bg: #eee;
  --bs-secondary-bg-rgb: 238, 238, 238;
  --bs-tertiary-color: rgba(34, 34, 34, 0.5);
  --bs-tertiary-color-rgb: 34, 34, 34;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #008cba;
  --bs-link-color-rgb: 0, 140, 186;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #007095;
  --bs-link-hover-color-rgb: 0, 112, 149;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #222;
  --bs-highlight-bg: #fbe9cc;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(0, 140, 186, 0.25);
  --bs-form-valid-color: #43ac6a;
  --bs-form-valid-border-color: #43ac6a;
  --bs-form-invalid-color: #f04124;
  --bs-form-invalid-border-color: #f04124;
}

[data-bs-theme=lux] {
  --bs-blue: #007bff;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #e83e8c;
  --bs-red: #d9534f;
  --bs-orange: #fd7e14;
  --bs-yellow: #f0ad4e;
  --bs-green: #4bbf73;
  --bs-teal: #20c997;
  --bs-cyan: #1f9bcf;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #919aa1;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #f7f7f9;
  --bs-gray-300: #eceeef;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #919aa1;
  --bs-gray-700: #55595c;
  --bs-gray-800: #343a40;
  --bs-gray-900: #1a1a1a;
  --bs-primary: #1a1a1a;
  --bs-secondary: #fff;
  --bs-success: #4bbf73;
  --bs-info: #1f9bcf;
  --bs-warning: #f0ad4e;
  --bs-danger: #d9534f;
  --bs-light: #fff;
  --bs-dark: #343a40;
  --bs-primary-rgb: 26, 26, 26;
  --bs-secondary-rgb: 150, 150, 150;
  --bs-success-rgb: 75, 191, 115;
  --bs-info-rgb: 31, 155, 207;
  --bs-warning-rgb: 240, 173, 78;
  --bs-danger-rgb: 217, 83, 79;
  --bs-light-rgb: 255, 255, 255;
  --bs-dark-rgb: 52, 58, 64;
  --bs-primary-text-emphasis: #0a0a0a;
  --bs-secondary-text-emphasis: #666666;
  --bs-success-text-emphasis: #1e4c2e;
  --bs-info-text-emphasis: #0c3e53;
  --bs-warning-text-emphasis: #60451f;
  --bs-danger-text-emphasis: #572120;
  --bs-light-text-emphasis: #55595c;
  --bs-dark-text-emphasis: #55595c;
  --bs-primary-bg-subtle: #d1d1d1;
  --bs-secondary-bg-subtle: white;
  --bs-success-bg-subtle: #dbf2e3;
  --bs-info-bg-subtle: #d2ebf5;
  --bs-warning-bg-subtle: #fcefdc;
  --bs-danger-bg-subtle: #f7dddc;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #ced4da;
  --bs-primary-border-subtle: #a3a3a3;
  --bs-secondary-border-subtle: white;
  --bs-success-border-subtle: #b7e5c7;
  --bs-info-border-subtle: #a5d7ec;
  --bs-warning-border-subtle: #f9deb8;
  --bs-danger-border-subtle: #f0bab9;
  --bs-light-border-subtle: #f7f7f9;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 300;
  --bs-body-line-height: 1.5;
  --bs-body-color: #55595c;
  --bs-body-color-rgb: 85, 89, 92;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(85, 89, 92, 0.75);
  --bs-secondary-color-rgb: 85, 89, 92;
  --bs-secondary-bg: #f7f7f9;
  --bs-secondary-bg-rgb: 247, 247, 249;
  --bs-tertiary-color: rgba(85, 89, 92, 0.5);
  --bs-tertiary-color-rgb: 85, 89, 92;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: #1a1a1a;
  --bs-link-color: #1a1a1a;
  --bs-link-color-rgb: 26, 26, 26;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #151515;
  --bs-link-hover-color-rgb: 21, 21, 21;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #55595c;
  --bs-highlight-bg: #fcefdc;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #eceeef;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(26, 26, 26, 0.25);
  --bs-form-valid-color: #4bbf73;
  --bs-form-valid-border-color: #4bbf73;
  --bs-form-invalid-color: #d9534f;
  --bs-form-invalid-border-color: #d9534f;
}

[data-bs-theme=dark_black] {
  color-scheme: dark;
  --bs-body-color: #eceeef;
  --bs-body-color-rgb: 236, 238, 239;
  --bs-body-bg: #1a1a1a;
  --bs-body-bg-rgb: 26, 26, 26;
  --bs-emphasis-color: #fff;
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-secondary-color: rgba(236, 238, 239, 0.75);
  --bs-secondary-color-rgb: 236, 238, 239;
  --bs-secondary-bg: #343a40;
  --bs-secondary-bg-rgb: 52, 58, 64;
  --bs-tertiary-color: rgba(236, 238, 239, 0.5);
  --bs-tertiary-color-rgb: 236, 238, 239;
  --bs-tertiary-bg: #272a2d;
  --bs-tertiary-bg-rgb: 39, 42, 45;
  --bs-primary-text-emphasis: #767676;
  --bs-secondary-text-emphasis: white;
  --bs-success-text-emphasis: #93d9ab;
  --bs-info-text-emphasis: #79c3e2;
  --bs-warning-text-emphasis: #f6ce95;
  --bs-danger-text-emphasis: #e89895;
  --bs-light-text-emphasis: #f8f9fa;
  --bs-dark-text-emphasis: #eceeef;
  --bs-primary-bg-subtle: #050505;
  --bs-secondary-bg-subtle: #333333;
  --bs-success-bg-subtle: #0f2617;
  --bs-info-bg-subtle: #061f29;
  --bs-warning-bg-subtle: #302310;
  --bs-danger-bg-subtle: #2b1110;
  --bs-light-bg-subtle: #343a40;
  --bs-dark-bg-subtle: #1a1d20;
  --bs-primary-border-subtle: #101010;
  --bs-secondary-border-subtle: #999999;
  --bs-success-border-subtle: #2d7345;
  --bs-info-border-subtle: #135d7c;
  --bs-warning-border-subtle: #90682f;
  --bs-danger-border-subtle: #82322f;
  --bs-light-border-subtle: #55595c;
  --bs-dark-border-subtle: #343a40;
  --bs-heading-color: inherit;
  --bs-link-color: #767676;
  --bs-link-hover-color: #919191;
  --bs-link-color-rgb: 118, 118, 118;
  --bs-link-hover-color-rgb: 145, 145, 145;
  --bs-code-color: #f18bba;
  --bs-highlight-color: #eceeef;
  --bs-highlight-bg: #60451f;
  --bs-border-color: #55595c;
  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
  --bs-form-valid-color: #93d9ab;
  --bs-form-valid-border-color: #93d9ab;
  --bs-form-invalid-color: #e89895;
  --bs-form-invalid-border-color: #e89895;
}


[data-bs-theme=light] {
  --bs-blue: #007bff;
  --bs-indigo: #6610f2;
  --bs-purple: #593196;
  --bs-pink: #e83e8c;
  --bs-red: #fc3939;
  --bs-orange: #fd7e14;
  --bs-yellow: #efa31d;
  --bs-green: #13b955;
  --bs-teal: #20c997;
  --bs-cyan: #009cdc;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #868e96;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #fafafa;
  --bs-gray-200: #f9f8fc;
  --bs-gray-300: #ededed;
  --bs-gray-400: #cbc8d0;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #868e96;
  --bs-gray-700: #444;
  --bs-gray-800: #343a40;
  --bs-gray-900: #17141f;
  --bs-primary: #593196;
  --bs-secondary: #a991d4;
  --bs-success: #13b955;
  --bs-info: #009cdc;
  --bs-warning: #efa31d;
  --bs-danger: #fc3939;
  --bs-light: #f9f8fc;
  --bs-dark: #17141f;
  --bs-primary-rgb: 89, 49, 150;
  --bs-secondary-rgb: 169, 145, 212;
  --bs-success-rgb: 19, 185, 85;
  --bs-info-rgb: 0, 156, 220;
  --bs-warning-rgb: 239, 163, 29;
  --bs-danger-rgb: 252, 57, 57;
  --bs-light-rgb: 249, 248, 252;
  --bs-dark-rgb: 23, 20, 31;
  --bs-primary-text-emphasis: #24143c;
  --bs-secondary-text-emphasis: #443a55;
  --bs-success-text-emphasis: #084a22;
  --bs-info-text-emphasis: #003e58;
  --bs-warning-text-emphasis: #60410c;
  --bs-danger-text-emphasis: #651717;
  --bs-light-text-emphasis: #444;
  --bs-dark-text-emphasis: #444;
  --bs-primary-bg-subtle: #ded6ea;
  --bs-secondary-bg-subtle: #eee9f6;
  --bs-success-bg-subtle: #d0f1dd;
  --bs-info-bg-subtle: #ccebf8;
  --bs-warning-bg-subtle: #fcedd2;
  --bs-danger-bg-subtle: #fed7d7;
  --bs-light-bg-subtle: #fdfdfd;
  --bs-dark-bg-subtle: #cbc8d0;
  --bs-primary-border-subtle: #bdadd5;
  --bs-secondary-border-subtle: #ddd3ee;
  --bs-success-border-subtle: #a1e3bb;
  --bs-info-border-subtle: #99d7f1;
  --bs-warning-border-subtle: #f9daa5;
  --bs-danger-border-subtle: #feb0b0;
  --bs-light-border-subtle: #f9f8fc;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #444;
  --bs-body-color-rgb: 68, 68, 68;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(68, 68, 68, 0.75);
  --bs-secondary-color-rgb: 68, 68, 68;
  --bs-secondary-bg: #f9f8fc;
  --bs-secondary-bg-rgb: 249, 248, 252;
  --bs-tertiary-color: rgba(68, 68, 68, 0.5);
  --bs-tertiary-color-rgb: 68, 68, 68;
  --bs-tertiary-bg: #fafafa;
  --bs-tertiary-bg-rgb: 250, 250, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #593196;
  --bs-link-color-rgb: 89, 49, 150;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #593196;
  --bs-link-hover-color-rgb: 89, 49, 150;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #444;
  --bs-highlight-bg: #fcedd2;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #ededed;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(89, 49, 150, 0.25);
  --bs-form-valid-color: #13b955;
  --bs-form-valid-border-color: #13b955;
  --bs-form-invalid-color: #fc3939;
  --bs-form-invalid-border-color: #fc3939;
}

[data-bs-theme=sketchy] {
	@import url("https://fonts.googleapis.com/css?family=Neucha|Cabin+Sketch&display=swap");
  --bs-blue: #007bff;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #e83e8c;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #28a745;
  --bs-teal: #20c997;
  --bs-cyan: #17a2b8;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #868e96;
  --bs-gray-dark: #333;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #f7f7f9;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ccc;
  --bs-gray-500: #aaa;
  --bs-gray-600: #868e96;
  --bs-gray-700: #555;
  --bs-gray-800: #333;
  --bs-gray-900: #212529;
  --bs-primary: #333;
  --bs-secondary: #555;
  --bs-success: #28a745;
  --bs-info: #17a2b8;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #fff;
  --bs-dark: #555;
  --bs-primary-rgb: 51, 51, 51;
  --bs-secondary-rgb: 85, 85, 85;
  --bs-success-rgb: 40, 167, 69;
  --bs-info-rgb: 23, 162, 184;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 255, 255, 255;
  --bs-dark-rgb: 85, 85, 85;
  --bs-primary-text-emphasis: #141414;
  --bs-secondary-text-emphasis: #222222;
  --bs-success-text-emphasis: #10431c;
  --bs-info-text-emphasis: #09414a;
  --bs-warning-text-emphasis: #664d03;
  --bs-danger-text-emphasis: #58151c;
  --bs-light-text-emphasis: #555;
  --bs-dark-text-emphasis: #555;
  --bs-primary-bg-subtle: #d6d6d6;
  --bs-secondary-bg-subtle: #dddddd;
  --bs-success-bg-subtle: #d4edda;
  --bs-info-bg-subtle: #d1ecf1;
  --bs-warning-bg-subtle: #fff3cd;
  --bs-danger-bg-subtle: #f8d7da;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #ccc;
  --bs-primary-border-subtle: #adadad;
  --bs-secondary-border-subtle: #bbbbbb;
  --bs-success-border-subtle: #a9dcb5;
  --bs-info-border-subtle: #a2dae3;
  --bs-warning-border-subtle: #ffe69c;
  --bs-danger-border-subtle: #f1aeb5;
  --bs-light-border-subtle: #f7f7f9;
  --bs-dark-border-subtle: #aaa;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: Neucha, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 700;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(33, 37, 41, 0.75);
  --bs-secondary-color-rgb: 33, 37, 41;
  --bs-secondary-bg: #f7f7f9;
  --bs-secondary-bg-rgb: 247, 247, 249;
  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
  --bs-tertiary-color-rgb: 33, 37, 41;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #333;
  --bs-link-color-rgb: 51, 51, 51;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #292929;
  --bs-link-hover-color-rgb: 41, 41, 41;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #212529;
  --bs-highlight-bg: #fff3cd;
  --bs-border-width: 2px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 25px;
  --bs-border-radius-sm: 15px;
  --bs-border-radius-lg: 35px;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(51, 51, 51, 0.25);
  --bs-form-valid-color: #28a745;
  --bs-form-valid-border-color: #28a745;
  --bs-form-invalid-color: #dc3545;
  --bs-form-invalid-border-color: #dc3545;
}
[data-bs-theme=simplex] {
  --bs-blue: #007bff;
  --bs-indigo: #6610f2;
  --bs-purple: #9b479f;
  --bs-pink: #e83e8c;
  --bs-red: #d9230f;
  --bs-orange: #d9831f;
  --bs-yellow: #ffc107;
  --bs-green: #469408;
  --bs-teal: #20c997;
  --bs-cyan: #029acf;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #777;
  --bs-gray-dark: #373a3c;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #ddd;
  --bs-gray-300: #ccc;
  --bs-gray-400: #bbb;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #777;
  --bs-gray-700: #444;
  --bs-gray-800: #373a3c;
  --bs-gray-900: #212529;
  --bs-primary: #d9230f;
  --bs-secondary: #ddd;
  --bs-success: #469408;
  --bs-info: #029acf;
  --bs-warning: #d9831f;
  --bs-danger: #9b479f;
  --bs-light: #fff;
  --bs-dark: #373a3c;
  --bs-primary-rgb: 217, 35, 15;
  --bs-secondary-rgb: 163, 163, 163;
  --bs-success-rgb: 70, 148, 8;
  --bs-info-rgb: 2, 154, 207;
  --bs-warning-rgb: 217, 131, 31;
  --bs-danger-rgb: 155, 71, 159;
  --bs-light-rgb: 163, 163, 163;
  --bs-dark-rgb: 55, 58, 60;
  --bs-primary-text-emphasis: #570e06;
  --bs-secondary-text-emphasis: #666666;
  --bs-success-text-emphasis: #1c3b03;
  --bs-info-text-emphasis: #013e53;
  --bs-warning-text-emphasis: #57340c;
  --bs-danger-text-emphasis: #3e1c40;
  --bs-light-text-emphasis: #444;
  --bs-dark-text-emphasis: #444;
  --bs-primary-bg-subtle: #f7d3cf;
  --bs-secondary-bg-subtle: white;
  --bs-success-bg-subtle: #daeace;
  --bs-info-bg-subtle: #ccebf5;
  --bs-warning-bg-subtle: #f7e6d2;
  --bs-danger-bg-subtle: #ebdaec;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #bbb;
  --bs-primary-border-subtle: #f0a79f;
  --bs-secondary-border-subtle: #ddd;
  --bs-success-border-subtle: #b5d49c;
  --bs-info-border-subtle: #9ad7ec;
  --bs-warning-border-subtle: #f0cda5;
  --bs-danger-border-subtle: #d7b5d9;
  --bs-light-border-subtle: #ddd;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg: #fcfcfc;
  --bs-body-bg-rgb: 252, 252, 252;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(33, 37, 41, 0.75);
  --bs-secondary-color-rgb: 33, 37, 41;
  --bs-secondary-bg: #ddd;
  --bs-secondary-bg-rgb: 221, 221, 221;
  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
  --bs-tertiary-color-rgb: 33, 37, 41;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-heading-color: inherit;
  --bs-link-color: #d9230f;
  --bs-link-color-rgb: 217, 35, 15;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #ae1c0c;
  --bs-link-hover-color-rgb: 174, 28, 12;
  --bs-code-color: #e83e8c;
  --bs-highlight-color: #212529;
  --bs-highlight-bg: #fff3cd;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #ccc;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(217, 35, 15, 0.25);
  --bs-form-valid-color: #469408;
  --bs-form-valid-border-color: #469408;
  --bs-form-invalid-color: #9b479f;
  --bs-form-invalid-border-color: #9b479f;
}

.bd-blue-100 {
    color: #000;
    background-color: #cfe2ff;
}
.bd-blue-200 {
    color: #000;
    background-color: #9ec5fe;
}
.bd-blue-300 {
    color: #000;
    background-color: #6ea8fe;
}
.bd-blue-400 {
    color: #000;
    background-color: #3d8bfd;
}
.bd-blue-500 {
    color: #fff;
    background-color: #0d6efd;
}
.bd-blue-600 {
    color: #fff;
    background-color: #0a58ca;
}
.bd-blue-700 {
    color: #fff;
    background-color: #084298;
}
.bd-blue-800 {
    color: #fff;
    background-color: #052c65;
}
.bd-blue-900 {
    color: #fff;
    background-color: #031633;
}
.bd-indigo-100 {
    color: #000;
    background-color: #e0cffc;
}
.bd-indigo-200 {
    color: #000;
    background-color: #c29ffa;
}
.bd-indigo-300 {
    color: #000;
    background-color: #a370f7;
}
.bd-indigo-400 {
    color: #fff;
    background-color: #8540f5;
}
.bd-indigo-500 {
    color: #fff;
    background-color: #6610f2;
}
.bd-indigo-600 {
    color: #fff;
    background-color: #520dc2;
}
.bd-indigo-700 {
    color: #fff;
    background-color: #3d0a91;
}
.bd-indigo-800 {
    color: #fff;
    background-color: #290661;
}
.bd-indigo-900 {
    color: #fff;
    background-color: #140330;
}
.bd-purple-100 {
    color: #000;
    background-color: #e2d9f3;
}
.bd-purple-200 {
    color: #000;
    background-color: #c5b3e6;
}
.bd-purple-300 {
    color: #000;
    background-color: #a98eda;
}
.bd-purple-400 {
    color: #000;
    background-color: #8c68cd;
}
.bd-purple-500 {
    color: #fff;
    background-color: #6f42c1;
}
.bd-purple-600 {
    color: #fff;
    background-color: #59359a;
}
.bd-purple-700 {
    color: #fff;
    background-color: #432874;
}
.bd-purple-800 {
    color: #fff;
    background-color: #2c1a4d;
}
.bd-purple-900 {
    color: #fff;
    background-color: #160d27;
}
.bd-pink-100 {
    color: #000;
    background-color: #f7d6e6;
}
.bd-pink-200 {
    color: #000;
    background-color: #efadce;
}
.bd-pink-300 {
    color: #000;
    background-color: #e685b5;
}
.bd-pink-400 {
    color: #000;
    background-color: #de5c9d;
}
.bd-pink-500 {
    color: #fff;
    background-color: #d63384;
}
.bd-pink-600 {
    color: #fff;
    background-color: #ab296a;
}
.bd-pink-700 {
    color: #fff;
    background-color: #801f4f;
}
.bd-pink-800 {
    color: #fff;
    background-color: #561435;
}
.bd-pink-900 {
    color: #fff;
    background-color: #2b0a1a;
}
.bd-red-100 {
    color: #000;
    background-color: #f8d7da;
}
.bd-red-200 {
    color: #000;
    background-color: #f1aeb5;
}
.bd-red-300 {
    color: #000;
    background-color: #ea868f;
}
.bd-red-400 {
    color: #000;
    background-color: #e35d6a;
}
.bd-red-500 {
    color: #fff;
    background-color: #dc3545;
}
.bd-red-600 {
    color: #fff;
    background-color: #b02a37;
}
.bd-red-700 {
    color: #fff;
    background-color: #842029;
}
.bd-red-800 {
    color: #fff;
    background-color: #58151c;
}
.bd-red-900 {
    color: #fff;
    background-color: #2c0b0e;
}
.bd-orange-100 {
    color: #000;
    background-color: #ffe5d0;
}
.bd-orange-200 {
    color: #000;
    background-color: #fecba1;
}
.bd-orange-300 {
    color: #000;
    background-color: #feb272;
}
.bd-orange-400 {
    color: #000;
    background-color: #fd9843;
}
.bd-orange-500 {
    color: #000;
    background-color: #fd7e14;
}
.bd-orange-600 {
    color: #000;
    background-color: #ca6510;
}
.bd-orange-700 {
    color: #fff;
    background-color: #984c0c;
}
.bd-orange-800 {
    color: #fff;
    background-color: #653208;
}
.bd-orange-900 {
    color: #fff;
    background-color: #331904;
}
.bd-yellow-100 {
    color: #000;
    background-color: #fff3cd;
}
.bd-yellow-200 {
    color: #000;
    background-color: #ffe69c;
}
.bd-yellow-300 {
    color: #000;
    background-color: #ffda6a;
}
.bd-yellow-400 {
    color: #000;
    background-color: #ffcd39;
}
.bd-yellow-500 {
    color: #000;
    background-color: #ffc107;
}
.bd-yellow-600 {
    color: #000;
    background-color: #cc9a06;
}
.bd-yellow-700 {
    color: #000;
    background-color: #997404;
}
.bd-yellow-800 {
    color: #fff;
    background-color: #664d03;
}
.bd-yellow-900 {
    color: #fff;
    background-color: #332701;
}
.bd-green-100 {
    color: #000;
    background-color: #d1e7dd;
}
.bd-green-200 {
    color: #000;
    background-color: #a3cfbb;
}
.bd-green-300 {
    color: #000;
    background-color: #75b798;
}
.bd-green-400 {
    color: #000;
    background-color: #479f76;
}
.bd-green-500 {
    color: #fff;
    background-color: #198754;
}
.bd-green-600 {
    color: #fff;
    background-color: #146c43;
}
.bd-green-700 {
    color: #fff;
    background-color: #0f5132;
}
.bd-green-800 {
    color: #fff;
    background-color: #0a3622;
}
.bd-green-900 {
    color: #fff;
    background-color: #051b11;
}
.bd-teal-100 {
    color: #000;
    background-color: #d2f4ea;
}
.bd-teal-200 {
    color: #000;
    background-color: #a6e9d5;
}
.bd-teal-300 {
    color: #000;
    background-color: #79dfc1;
}
.bd-teal-400 {
    color: #000;
    background-color: #4dd4ac;
}
.bd-teal-500 {
    color: #000;
    background-color: #20c997;
}
.bd-teal-600 {
    color: #000;
    background-color: #1aa179;
}
.bd-teal-700 {
    color: #fff;
    background-color: #13795b;
}
.bd-teal-800 {
    color: #fff;
    background-color: #0d503c;
}
.bd-teal-900 {
    color: #fff;
    background-color: #06281e;
}
.bd-cyan-100 {
    color: #000;
    background-color: #cff4fc;
}
.bd-cyan-200 {
    color: #000;
    background-color: #9eeaf9;
}
.bd-cyan-300 {
    color: #000;
    background-color: #6edff6;
}
.bd-cyan-400 {
    color: #000;
    background-color: #3dd5f3;
}
.bd-cyan-500 {
    color: #000;
    background-color: #0dcaf0;
}
.bd-cyan-600 {
    color: #000;
    background-color: #0aa2c0;
}
.bd-cyan-700 {
    color: #fff;
    background-color: #087990;
}
.bd-cyan-800 {
    color: #fff;
    background-color: #055160;
}
.bd-cyan-900 {
    color: #fff;
    background-color: #032830;
}
.bd-gray-100 {
    color: #000;
    background-color: #f8f9fa;
}
.bd-gray-200 {
    color: #000;
    background-color: #e9ecef;
}
.bd-gray-300 {
    color: #000;
    background-color: #dee2e6;
}
.bd-gray-400 {
    color: #000;
    background-color: #ced4da;
}
.bd-gray-500 {
    color: #000;
    background-color: #adb5bd;
}
.bd-gray-600 {
    color: #fff;
    background-color: #6c757d;
}
.bd-gray-700 {
    color: #fff;
    background-color: #495057;
}
.bd-gray-800 {
    color: #fff;
    background-color: #343a40;
}
.bd-gray-900 {
    color: #fff;
    background-color: #212529;
}
.bd-white {
    color: #000;
    background-color: #fff;
}
.bd-black {
    color: #fff;
    background-color: #000;
}




.table-success-dark {
    --bs-table-color: #000;
    --bs-table-bg: #198754;
    --bs-table-border-color: #178652;
    --bs-table-striped-bg: #5fbf93;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #5fbf93;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #258d5d;
    --bs-table-hover-color: #fff;
    color: white !important;
    border-color: var(--bs-table-border-color);
}
.table-warning-dark {
    --bs-table-color: #000;
    --bs-table-bg: #ffc107;
    --bs-table-border-color: #ffc107;
    --bs-table-striped-bg: #f0d995;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #eab71f;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #eab71f;
    --bs-table-hover-color: #000;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}
.table-danger-dark {
    --bs-table-color: #fff;
    --bs-table-bg: #c81f2f;
    --bs-table-border-color: #dc3545;
    --bs-table-striped-bg: #e65361;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #e65361;
    --bs-table-active-color: #e65361;
    --bs-table-hover-bg: #c81f2f;
    --bs-table-hover-color: #fff;
    color: white !important;
    border-color: var(--bs-table-border-color);
}
form#advancedSearch.form-horizontal div.form-group.row.mb-3{
	margin-bottom: 3px !important;
}

.stripe-loading-indicator .stripe, .stripe-loading-indicator .stripe-loaded {
  background: #aeda31 !important;
}


.progress-bar-vertical .progress-bar {
  width: 100%;
  height: 0;
  -webkit-transition: height 0.6s ease;
  -o-transition: height 0.6s ease;
  transition: height 0.6s ease;
}

.badge{
	border-radius: 2px !important;
}

.device-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.3);display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.5s;cursor: pointer;border-radius:3px;}
.device-edit-icon {font-size: 3rem;color: white;}
.device-image-wrapper:hover .device-overlay {opacity: 1;}

.car-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.3);display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.5s;cursor: pointer;border-radius:3px;}
.car-edit-icon {font-size: 3rem;color: white;}
.car-image-wrapper:hover .car-overlay {opacity: 1;}


.highlight_save {outline: 2px dashed red;cursor: pointer;}

.toast{
	min-width: 350px !important;
	max-width: 600px !important;
}














/* === BLUE === */
.text-blue-100 { color: #cfe2ff !important; }
.bg-blue-100 { background-color: #cfe2ff !important; }
.border-blue-100 { border-color: #cfe2ff !important; }
.text-blue-200 { color: #9ec5fe !important; }
.bg-blue-200 { background-color: #9ec5fe !important; }
.border-blue-200 { border-color: #9ec5fe !important; }
.text-blue-300 { color: #6ea8fe !important; }
.bg-blue-300 { background-color: #6ea8fe !important; }
.border-blue-300 { border-color: #6ea8fe !important; }
.text-blue-400 { color: #3d8bfd !important; }
.bg-blue-400 { background-color: #3d8bfd !important; }
.border-blue-400 { border-color: #3d8bfd !important; }
.text-blue-500 { color: #0d6efd !important; }
.bg-blue-500 { background-color: #0d6efd !important; }
.border-blue-500 { border-color: #0d6efd !important; }
.text-blue-600 { color: #0a58ca !important; }
.bg-blue-600 { background-color: #0a58ca !important; }
.border-blue-600 { border-color: #0a58ca !important; }
.text-blue-700 { color: #084298 !important; }
.bg-blue-700 { background-color: #084298 !important; }
.border-blue-700 { border-color: #084298 !important; }
.text-blue-800 { color: #052c65 !important; }
.bg-blue-800 { background-color: #052c65 !important; }
.border-blue-800 { border-color: #052c65 !important; }
.text-blue-900 { color: #031633 !important; }
.bg-blue-900 { background-color: #031633 !important; }
.border-blue-900 { border-color: #031633 !important; }

/* === INDIGO === */
.text-indigo-100 { color: #e0cffc !important; }
.bg-indigo-100 { background-color: #e0cffc !important; }
.border-indigo-100 { border-color: #e0cffc !important; }
.text-indigo-200 { color: #c29ffa !important; }
.bg-indigo-200 { background-color: #c29ffa !important; }
.border-indigo-200 { border-color: #c29ffa !important; }
.text-indigo-300 { color: #a370f7 !important; }
.bg-indigo-300 { background-color: #a370f7 !important; }
.border-indigo-300 { border-color: #a370f7 !important; }
.text-indigo-400 { color: #8540f5 !important; }
.bg-indigo-400 { background-color: #8540f5 !important; }
.border-indigo-400 { border-color: #8540f5 !important; }
.text-indigo-500 { color: #6610f2 !important; }
.bg-indigo-500 { background-color: #6610f2 !important; }
.border-indigo-500 { border-color: #6610f2 !important; }
.text-indigo-600 { color: #520dc2 !important; }
.bg-indigo-600 { background-color: #520dc2 !important; }
.border-indigo-600 { border-color: #520dc2 !important; }
.text-indigo-700 { color: #3d0a91 !important; }
.bg-indigo-700 { background-color: #3d0a91 !important; }
.border-indigo-700 { border-color: #3d0a91 !important; }
.text-indigo-800 { color: #290661 !important; }
.bg-indigo-800 { background-color: #290661 !important; }
.border-indigo-800 { border-color: #290661 !important; }
.text-indigo-900 { color: #140330 !important; }
.bg-indigo-900 { background-color: #140330 !important; }
.border-indigo-900 { border-color: #140330 !important; }

/* === PURPLE === */
.text-purple-100 { color: #e2d9f3 !important; }
.bg-purple-100 { background-color: #e2d9f3 !important; }
.border-purple-100 { border-color: #e2d9f3 !important; }
.text-purple-200 { color: #c5b3e6 !important; }
.bg-purple-200 { background-color: #c5b3e6 !important; }
.border-purple-200 { border-color: #c5b3e6 !important; }
.text-purple-300 { color: #a98eda !important; }
.bg-purple-300 { background-color: #a98eda !important; }
.border-purple-300 { border-color: #a98eda !important; }
.text-purple-400 { color: #8c68cd !important; }
.bg-purple-400 { background-color: #8c68cd !important; }
.border-purple-400 { border-color: #8c68cd !important; }
.text-purple-500 { color: #6f42c1 !important; }
.bg-purple-500 { background-color: #6f42c1 !important; }
.border-purple-500 { border-color: #6f42c1 !important; }
.text-purple-600 { color: #59359a !important; }
.bg-purple-600 { background-color: #59359a !important; }
.border-purple-600 { border-color: #59359a !important; }
.text-purple-700 { color: #432874 !important; }
.bg-purple-700 { background-color: #432874 !important; }
.border-purple-700 { border-color: #432874 !important; }
.text-purple-800 { color: #2c1a4d !important; }
.bg-purple-800 { background-color: #2c1a4d !important; }
.border-purple-800 { border-color: #2c1a4d !important; }
.text-purple-900 { color: #160d27 !important; }
.bg-purple-900 { background-color: #160d27 !important; }
.border-purple-900 { border-color: #160d27 !important; }
/* === PINK === */
.text-pink-100 { color: #f7d6e6 !important; }
.bg-pink-100 { background-color: #f7d6e6 !important; }
.border-pink-100 { border-color: #f7d6e6 !important; }
.text-pink-200 { color: #efadce !important; }
.bg-pink-200 { background-color: #efadce !important; }
.border-pink-200 { border-color: #efadce !important; }
.text-pink-300 { color: #e685b5 !important; }
.bg-pink-300 { background-color: #e685b5 !important; }
.border-pink-300 { border-color: #e685b5 !important; }
.text-pink-400 { color: #de5c9d !important; }
.bg-pink-400 { background-color: #de5c9d !important; }
.border-pink-400 { border-color: #de5c9d !important; }
.text-pink-500 { color: #d63384 !important; }
.bg-pink-500 { background-color: #d63384 !important; }
.border-pink-500 { border-color: #d63384 !important; }
.text-pink-600 { color: #ab296a !important; }
.bg-pink-600 { background-color: #ab296a !important; }
.border-pink-600 { border-color: #ab296a !important; }
.text-pink-700 { color: #801f4f !important; }
.bg-pink-700 { background-color: #801f4f !important; }
.border-pink-700 { border-color: #801f4f !important; }
.text-pink-800 { color: #561435 !important; }
.bg-pink-800 { background-color: #561435 !important; }
.border-pink-800 { border-color: #561435 !important; }
.text-pink-900 { color: #2b0a1a !important; }
.bg-pink-900 { background-color: #2b0a1a !important; }
.border-pink-900 { border-color: #2b0a1a !important; }

/* === RED === */
.text-red-100 { color: #f8d7da !important; }
.bg-red-100 { background-color: #f8d7da !important; }
.border-red-100 { border-color: #f8d7da !important; }
.text-red-200 { color: #f1aeb5 !important; }
.bg-red-200 { background-color: #f1aeb5 !important; }
.border-red-200 { border-color: #f1aeb5 !important; }
.text-red-300 { color: #ea868f !important; }
.bg-red-300 { background-color: #ea868f !important; }
.border-red-300 { border-color: #ea868f !important; }
.text-red-400 { color: #e35d6a !important; }
.bg-red-400 { background-color: #e35d6a !important; }
.border-red-400 { border-color: #e35d6a !important; }
.text-red-500 { color: #dc3545 !important; }
.bg-red-500 { background-color: #dc3545 !important; }
.border-red-500 { border-color: #dc3545 !important; }
.text-red-600 { color: #b02a37 !important; }
.bg-red-600 { background-color: #b02a37 !important; }
.border-red-600 { border-color: #b02a37 !important; }
.text-red-700 { color: #842029 !important; }
.bg-red-700 { background-color: #842029 !important; }
.border-red-700 { border-color: #842029 !important; }
.text-red-800 { color: #58151c !important; }
.bg-red-800 { background-color: #58151c !important; }
.border-red-800 { border-color: #58151c !important; }
.text-red-900 { color: #2c0b0e !important; }
.bg-red-900 { background-color: #2c0b0e !important; }
.border-red-900 { border-color: #2c0b0e !important; }

/* === ORANGE === */
.text-orange-100 { color: #ffe5d0 !important; }
.bg-orange-100 { background-color: #ffe5d0 !important; }
.border-orange-100 { border-color: #ffe5d0 !important; }
.text-orange-200 { color: #fecba1 !important; }
.bg-orange-200 { background-color: #fecba1 !important; }
.border-orange-200 { border-color: #fecba1 !important; }
.text-orange-300 { color: #feb272 !important; }
.bg-orange-300 { background-color: #feb272 !important; }
.border-orange-300 { border-color: #feb272 !important; }
.text-orange-400 { color: #fd9843 !important; }
.bg-orange-400 { background-color: #fd9843 !important; }
.border-orange-400 { border-color: #fd9843 !important; }
.text-orange-500 { color: #fd7e14 !important; }
.bg-orange-500 { background-color: #fd7e14 !important; }
.border-orange-500 { border-color: #fd7e14 !important; }
.text-orange-600 { color: #ca6510 !important; }
.bg-orange-600 { background-color: #ca6510 !important; }
.border-orange-600 { border-color: #ca6510 !important; }
.text-orange-700 { color: #984c0c !important; }
.bg-orange-700 { background-color: #984c0c !important; }
.border-orange-700 { border-color: #984c0c !important; }
.text-orange-800 { color: #653208 !important; }
.bg-orange-800 { background-color: #653208 !important; }
.border-orange-800 { border-color: #653208 !important; }
.text-orange-900 { color: #331904 !important; }
.bg-orange-900 { background-color: #331904 !important; }
.border-orange-900 { border-color: #331904 !important; }
/* === YELLOW === */
.text-yellow-100 { color: #fff3cd !important; }
.bg-yellow-100 { background-color: #fff3cd !important; }
.border-yellow-100 { border-color: #fff3cd !important; }
.text-yellow-200 { color: #ffe69c !important; }
.bg-yellow-200 { background-color: #ffe69c !important; }
.border-yellow-200 { border-color: #ffe69c !important; }
.text-yellow-300 { color: #ffda6a !important; }
.bg-yellow-300 { background-color: #ffda6a !important; }
.border-yellow-300 { border-color: #ffda6a !important; }
.text-yellow-400 { color: #ffcd39 !important; }
.bg-yellow-400 { background-color: #ffcd39 !important; }
.border-yellow-400 { border-color: #ffcd39 !important; }
.text-yellow-500 { color: #ffc107 !important; }
.bg-yellow-500 { background-color: #ffc107 !important; }
.border-yellow-500 { border-color: #ffc107 !important; }
.text-yellow-600 { color: #cc9a06 !important; }
.bg-yellow-600 { background-color: #cc9a06 !important; }
.border-yellow-600 { border-color: #cc9a06 !important; }
.text-yellow-700 { color: #997404 !important; }
.bg-yellow-700 { background-color: #997404 !important; }
.border-yellow-700 { border-color: #997404 !important; }
.text-yellow-800 { color: #664d03 !important; }
.bg-yellow-800 { background-color: #664d03 !important; }
.border-yellow-800 { border-color: #664d03 !important; }
.text-yellow-900 { color: #332701 !important; }
.bg-yellow-900 { background-color: #332701 !important; }
.border-yellow-900 { border-color: #332701 !important; }

/* === GREEN === */
.text-green-100 { color: #d1e7dd !important; }
.bg-green-100 { background-color: #d1e7dd !important; }
.border-green-100 { border-color: #d1e7dd !important; }
.text-green-200 { color: #a3cfbb !important; }
.bg-green-200 { background-color: #a3cfbb !important; }
.border-green-200 { border-color: #a3cfbb !important; }
.text-green-300 { color: #75b798 !important; }
.bg-green-300 { background-color: #75b798 !important; }
.border-green-300 { border-color: #75b798 !important; }
.text-green-400 { color: #479f76 !important; }
.bg-green-400 { background-color: #479f76 !important; }
.border-green-400 { border-color: #479f76 !important; }
.text-green-500 { color: #198754 !important; }
.bg-green-500 { background-color: #198754 !important; }
.border-green-500 { border-color: #198754 !important; }
.text-green-600 { color: #146c43 !important; }
.bg-green-600 { background-color: #146c43 !important; }
.border-green-600 { border-color: #146c43 !important; }
.text-green-700 { color: #0f5132 !important; }
.bg-green-700 { background-color: #0f5132 !important; }
.border-green-700 { border-color: #0f5132 !important; }
.text-green-800 { color: #0a3622 !important; }
.bg-green-800 { background-color: #0a3622 !important; }
.border-green-800 { border-color: #0a3622 !important; }
.text-green-900 { color: #051b11 !important; }
.bg-green-900 { background-color: #051b11 !important; }
.border-green-900 { border-color: #051b11 !important; }

/* === TEAL === */
.text-teal-100 { color: #d2f4ea !important; }
.bg-teal-100 { background-color: #d2f4ea !important; }
.border-teal-100 { border-color: #d2f4ea !important; }
.text-teal-200 { color: #a6e9d5 !important; }
.bg-teal-200 { background-color: #a6e9d5 !important; }
.border-teal-200 { border-color: #a6e9d5 !important; }
.text-teal-300 { color: #79dfc1 !important; }
.bg-teal-300 { background-color: #79dfc1 !important; }
.border-teal-300 { border-color: #79dfc1 !important; }
.text-teal-400 { color: #4dd4ac !important; }
.bg-teal-400 { background-color: #4dd4ac !important; }
.border-teal-400 { border-color: #4dd4ac !important; }
.text-teal-500 { color: #20c997 !important; }
.bg-teal-500 { background-color: #20c997 !important; }
.border-teal-500 { border-color: #20c997 !important; }
.text-teal-600 { color: #1aa179 !important; }
.bg-teal-600 { background-color: #1aa179 !important; }
.border-teal-600 { border-color: #1aa179 !important; }
.text-teal-700 { color: #13795b !important; }
.bg-teal-700 { background-color: #13795b !important; }
.border-teal-700 { border-color: #13795b !important; }
.text-teal-800 { color: #0d503c !important; }
.bg-teal-800 { background-color: #0d503c !important; }
.border-teal-800 { border-color: #0d503c !important; }
.text-teal-900 { color: #06281e !important; }
.bg-teal-900 { background-color: #06281e !important; }
.border-teal-900 { border-color: #06281e !important; }

/* === CYAN === */
.text-cyan-100 { color: #cff4fc !important; }
.bg-cyan-100 { background-color: #cff4fc !important; }
.border-cyan-100 { border-color: #cff4fc !important; }
.text-cyan-200 { color: #9eeaf9 !important; }
.bg-cyan-200 { background-color: #9eeaf9 !important; }
.border-cyan-200 { border-color: #9eeaf9 !important; }
.text-cyan-300 { color: #6edff6 !important; }
.bg-cyan-300 { background-color: #6edff6 !important; }
.border-cyan-300 { border-color: #6edff6 !important; }
.text-cyan-400 { color: #3dd5f3 !important; }
.bg-cyan-400 { background-color: #3dd5f3 !important; }
.border-cyan-400 { border-color: #3dd5f3 !important; }
.text-cyan-500 { color: #0dcaf0 !important; }
.bg-cyan-500 { background-color: #0dcaf0 !important; }
.border-cyan-500 { border-color: #0dcaf0 !important; }
.text-cyan-600 { color: #0aa2c0 !important; }
.bg-cyan-600 { background-color: #0aa2c0 !important; }
.border-cyan-600 { border-color: #0aa2c0 !important; }
.text-cyan-700 { color: #087990 !important; }
.bg-cyan-700 { background-color: #087990 !important; }
.border-cyan-700 { border-color: #087990 !important; }
.text-cyan-800 { color: #055160 !important; }
.bg-cyan-800 { background-color: #055160 !important; }
.border-cyan-800 { border-color: #055160 !important; }
.text-cyan-900 { color: #032830 !important; }
.bg-cyan-900 { background-color: #032830 !important; }
.border-cyan-900 { border-color: #032830 !important; }

/* === GRAY === */
.text-gray-100 { color: #f8f9fa !important; }
.bg-gray-100 { background-color: #f8f9fa !important; }
.border-gray-100 { border-color: #f8f9fa !important; }
.text-gray-200 { color: #e9ecef !important; }
.bg-gray-200 { background-color: #e9ecef !important; }
.border-gray-200 { border-color: #e9ecef !important; }
.text-gray-300 { color: #dee2e6 !important; }
.bg-gray-300 { background-color: #dee2e6 !important; }
.border-gray-300 { border-color: #dee2e6 !important; }
.text-gray-400 { color: #ced4da !important; }
.bg-gray-400 { background-color: #ced4da !important; }
.border-gray-400 { border-color: #ced4da !important; }
.text-gray-500 { color: #adb5bd !important; }
.bg-gray-500 { background-color: #adb5bd !important; }
.border-gray-500 { border-color: #adb5bd !important; }
.text-gray-600 { color: #6c757d !important; }
.bg-gray-600 { background-color: #6c757d !important; }
.border-gray-600 { border-color: #6c757d !important; }
.text-gray-700 { color: #495057 !important; }
.bg-gray-700 { background-color: #495057 !important; }
.border-gray-700 { border-color: #495057 !important; }
.text-gray-800 { color: #343a40 !important; }
.bg-gray-800 { background-color: #343a40 !important; }
.border-gray-800 { border-color: #343a40 !important; }
.text-gray-900 { color: #212529 !important; }
.bg-gray-900 { background-color: #212529 !important; }
.border-gray-900 { border-color: #212529 !important; }

.btn[class*="btn-outline-blue-"]:hover,
.btn[class*="btn-outline-indigo-"]:hover,
.btn[class*="btn-outline-purple-"]:hover,
.btn[class*="btn-outline-pink-"]:hover,
.btn[class*="btn-outline-red-"]:hover,
.btn[class*="btn-outline-orange-"]:hover,
.btn[class*="btn-outline-yellow-"]:hover,
.btn[class*="btn-outline-green-"]:hover,
.btn[class*="btn-outline-teal-"]:hover,
.btn[class*="btn-outline-cyan-"]:hover,
.btn[class*="btn-outline-gray-"]:hover,

.btn[class*="btn-outline-blue-"]:focus,
.btn[class*="btn-outline-indigo-"]:focus,
.btn[class*="btn-outline-purple-"]:focus,
.btn[class*="btn-outline-pink-"]:focus,
.btn[class*="btn-outline-red-"]:focus,
.btn[class*="btn-outline-orange-"]:focus,
.btn[class*="btn-outline-yellow-"]:focus,
.btn[class*="btn-outline-green-"]:focus,
.btn[class*="btn-outline-teal-"]:focus,
.btn[class*="btn-outline-cyan-"]:focus,
.btn[class*="btn-outline-gray-"]:active,

.btn[class*="btn-outline-blue-"]:active,
.btn[class*="btn-outline-indigo-"]:active,
.btn[class*="btn-outline-purple-"]:active,
.btn[class*="btn-outline-pink-"]:active,
.btn[class*="btn-outline-red-"]:active,
.btn[class*="btn-outline-orange-"]:active,
.btn[class*="btn-outline-yellow-"]:active,
.btn[class*="btn-outline-green-"]:active,
.btn[class*="btn-outline-teal-"]:active,
.btn[class*="btn-outline-cyan-"]:active,
.btn[class*="btn-outline-gray-"]:active {
  background-color: var(--btn-bg) !important;
  border-color: var(--btn-bg) !important;
  color: #fff !important;
}
/* === BLUE === */
.btn-outline-blue-100 { --btn-bg: #cfe2ff; color: #cfe2ff; border-color: #cfe2ff; }
.btn-outline-blue-200 { --btn-bg: #9ec5fe; color: #9ec5fe; border-color: #9ec5fe; }
.btn-outline-blue-300 { --btn-bg: #6ea8fe; color: #6ea8fe; border-color: #6ea8fe; }
.btn-outline-blue-400 { --btn-bg: #3d8bfd; color: #3d8bfd; border-color: #3d8bfd; }
.btn-outline-blue-500 { --btn-bg: #0d6efd; color: #0d6efd; border-color: #0d6efd; }
.btn-outline-blue-600 { --btn-bg: #0a58ca; color: #0a58ca; border-color: #0a58ca; }
.btn-outline-blue-700 { --btn-bg: #084298; color: #084298; border-color: #084298; }
.btn-outline-blue-800 { --btn-bg: #052c65; color: #052c65; border-color: #052c65; }
.btn-outline-blue-900 { --btn-bg: #031633; color: #031633; border-color: #031633; }

/* === INDIGO === */
.btn-outline-indigo-100 { --btn-bg: #e0cffc; color: #e0cffc; border-color: #e0cffc; }
.btn-outline-indigo-200 { --btn-bg: #c29ffa; color: #c29ffa; border-color: #c29ffa; }
.btn-outline-indigo-300 { --btn-bg: #a370f7; color: #a370f7; border-color: #a370f7; }
.btn-outline-indigo-400 { --btn-bg: #8540f5; color: #8540f5; border-color: #8540f5; }
.btn-outline-indigo-500 { --btn-bg: #6610f2; color: #6610f2; border-color: #6610f2; }
.btn-outline-indigo-600 { --btn-bg: #520dc2; color: #520dc2; border-color: #520dc2; }
.btn-outline-indigo-700 { --btn-bg: #3d0a91; color: #3d0a91; border-color: #3d0a91; }
.btn-outline-indigo-800 { --btn-bg: #290661; color: #290661; border-color: #290661; }
.btn-outline-indigo-900 { --btn-bg: #140330; color: #140330; border-color: #140330; }

/* === PURPLE === */
.btn-outline-purple-100 { --btn-bg: #e2d9f3; color: #e2d9f3; border-color: #e2d9f3; }
.btn-outline-purple-200 { --btn-bg: #c5b3e6; color: #c5b3e6; border-color: #c5b3e6; }
.btn-outline-purple-300 { --btn-bg: #a98eda; color: #a98eda; border-color: #a98eda; }
.btn-outline-purple-400 { --btn-bg: #8c68cd; color: #8c68cd; border-color: #8c68cd; }
.btn-outline-purple-500 { --btn-bg: #6f42c1; color: #6f42c1; border-color: #6f42c1; }
.btn-outline-purple-600 { --btn-bg: #59359a; color: #59359a; border-color: #59359a; }
.btn-outline-purple-700 { --btn-bg: #432874; color: #432874; border-color: #432874; }
.btn-outline-purple-800 { --btn-bg: #2c1a4d; color: #2c1a4d; border-color: #2c1a4d; }
.btn-outline-purple-900 { --btn-bg: #160d27; color: #160d27; border-color: #160d27; }

/* === PINK === */
.btn-outline-pink-100 { --btn-bg: #f7d6e6; color: #f7d6e6; border-color: #f7d6e6; }
.btn-outline-pink-200 { --btn-bg: #efadce; color: #efadce; border-color: #efadce; }
.btn-outline-pink-300 { --btn-bg: #e685b5; color: #e685b5; border-color: #e685b5; }
.btn-outline-pink-400 { --btn-bg: #de5c9d; color: #de5c9d; border-color: #de5c9d; }
.btn-outline-pink-500 { --btn-bg: #d63384; color: #d63384; border-color: #d63384; }
.btn-outline-pink-600 { --btn-bg: #ab296a; color: #ab296a; border-color: #ab296a; }
.btn-outline-pink-700 { --btn-bg: #801f4f; color: #801f4f; border-color: #801f4f; }
.btn-outline-pink-800 { --btn-bg: #561435; color: #561435; border-color: #561435; }
.btn-outline-pink-900 { --btn-bg: #2b0a1a; color: #2b0a1a; border-color: #2b0a1a; }

/* === RED === */
.btn-outline-red-100 { --btn-bg: #f8d7da; color: #f8d7da; border-color: #f8d7da; }
.btn-outline-red-200 { --btn-bg: #f1aeb5; color: #f1aeb5; border-color: #f1aeb5; }
.btn-outline-red-300 { --btn-bg: #ea868f; color: #ea868f; border-color: #ea868f; }
.btn-outline-red-400 { --btn-bg: #e35d6a; color: #e35d6a; border-color: #e35d6a; }
.btn-outline-red-500 { --btn-bg: #dc3545; color: #dc3545; border-color: #dc3545; }
.btn-outline-red-600 { --btn-bg: #b02a37; color: #b02a37; border-color: #b02a37; }
.btn-outline-red-700 { --btn-bg: #842029; color: #842029; border-color: #842029; }
.btn-outline-red-800 { --btn-bg: #58151c; color: #58151c; border-color: #58151c; }
.btn-outline-red-900 { --btn-bg: #2c0b0e; color: #2c0b0e; border-color: #2c0b0e; }

/* === ORANGE === */
.btn-outline-orange-100 { --btn-bg: #ffe5d0; color: #ffe5d0; border-color: #ffe5d0; }
.btn-outline-orange-200 { --btn-bg: #fecba1; color: #fecba1; border-color: #fecba1; }
.btn-outline-orange-300 { --btn-bg: #feb272; color: #feb272; border-color: #feb272; }
.btn-outline-orange-400 { --btn-bg: #fd9843; color: #fd9843; border-color: #fd9843; }
.btn-outline-orange-500 { --btn-bg: #fd7e14; color: #fd7e14; border-color: #fd7e14; }
.btn-outline-orange-600 { --btn-bg: #ca6510; color: #ca6510; border-color: #ca6510; }
.btn-outline-orange-700 { --btn-bg: #984c0c; color: #984c0c; border-color: #984c0c; }
.btn-outline-orange-800 { --btn-bg: #653208; color: #653208; border-color: #653208; }
.btn-outline-orange-900 { --btn-bg: #331904; color: #331904; border-color: #331904; }

/* === YELLOW === */
.btn-outline-yellow-100 { --btn-bg: #fff3cd; color: #fff3cd; border-color: #fff3cd; }
.btn-outline-yellow-200 { --btn-bg: #ffe69c; color: #ffe69c; border-color: #ffe69c; }
.btn-outline-yellow-300 { --btn-bg: #ffda6a; color: #ffda6a; border-color: #ffda6a; }
.btn-outline-yellow-400 { --btn-bg: #ffcd39; color: #ffcd39; border-color: #ffcd39; }
.btn-outline-yellow-500 { --btn-bg: #ffc107; color: #ffc107; border-color: #ffc107; }
.btn-outline-yellow-600 { --btn-bg: #cc9a06; color: #cc9a06; border-color: #cc9a06; }
.btn-outline-yellow-700 { --btn-bg: #997404; color: #997404; border-color: #997404; }
.btn-outline-yellow-800 { --btn-bg: #664d03; color: #664d03; border-color: #664d03; }
.btn-outline-yellow-900 { --btn-bg: #332701; color: #332701; border-color: #332701; }

/* === GREEN === */
.btn-outline-green-100 { --btn-bg: #d1e7dd; color: #d1e7dd; border-color: #d1e7dd; }
.btn-outline-green-200 { --btn-bg: #a3cfbb; color: #a3cfbb; border-color: #a3cfbb; }
.btn-outline-green-300 { --btn-bg: #75b798; color: #75b798; border-color: #75b798; }
.btn-outline-green-400 { --btn-bg: #479f76; color: #479f76; border-color: #479f76; }
.btn-outline-green-500 { --btn-bg: #198754; color: #198754; border-color: #198754; }
.btn-outline-green-600 { --btn-bg: #146c43; color: #146c43; border-color: #146c43; }
.btn-outline-green-700 { --btn-bg: #0f5132; color: #0f5132; border-color: #0f5132; }
.btn-outline-green-800 { --btn-bg: #0a3622; color: #0a3622; border-color: #0a3622; }
.btn-outline-green-900 { --btn-bg: #051b11; color: #051b11; border-color: #051b11; }

/* === TEAL === */
.btn-outline-teal-100 { --btn-bg: #d2f4ea; color: #d2f4ea; border-color: #d2f4ea; }
.btn-outline-teal-200 { --btn-bg: #a6e9d5; color: #a6e9d5; border-color: #a6e9d5; }
.btn-outline-teal-300 { --btn-bg: #79dfc1; color: #79dfc1; border-color: #79dfc1; }
.btn-outline-teal-400 { --btn-bg: #4dd4ac; color: #4dd4ac; border-color: #4dd4ac; }
.btn-outline-teal-500 { --btn-bg: #20c997; color: #20c997; border-color: #20c997; }
.btn-outline-teal-600 { --btn-bg: #1aa179; color: #1aa179; border-color: #1aa179; }
.btn-outline-teal-700 { --btn-bg: #13795b; color: #13795b; border-color: #13795b; }
.btn-outline-teal-800 { --btn-bg: #0d503c; color: #0d503c; border-color: #0d503c; }
.btn-outline-teal-900 { --btn-bg: #06281e; color: #06281e; border-color: #06281e; }

/* === CYAN === */
.btn-outline-cyan-100 { --btn-bg: #cff4fc; color: #cff4fc; border-color: #cff4fc; }
.btn-outline-cyan-200 { --btn-bg: #9eeaf9; color: #9eeaf9; border-color: #9eeaf9; }
.btn-outline-cyan-300 { --btn-bg: #6edff6; color: #6edff6; border-color: #6edff6; }
.btn-outline-cyan-400 { --btn-bg: #3dd5f3; color: #3dd5f3; border-color: #3dd5f3; }
.btn-outline-cyan-500 { --btn-bg: #0dcaf0; color: #0dcaf0; border-color: #0dcaf0; }
.btn-outline-cyan-600 { --btn-bg: #0aa2c0; color: #0aa2c0; border-color: #0aa2c0; }
.btn-outline-cyan-700 { --btn-bg: #087990; color: #087990; border-color: #087990; }
.btn-outline-cyan-800 { --btn-bg: #055160; color: #055160; border-color: #055160; }
.btn-outline-cyan-900 { --btn-bg: #032830; color: #032830; border-color: #032830; }

/* === GRAY === */
.btn-outline-gray-100 { --btn-bg: #f8f9fa; color: #f8f9fa; border-color: #f8f9fa; }
.btn-outline-gray-200 { --btn-bg: #e9ecef; color: #e9ecef; border-color: #e9ecef; }
.btn-outline-gray-300 { --btn-bg: #dee2e6; color: #dee2e6; border-color: #dee2e6; }
.btn-outline-gray-400 { --btn-bg: #ced4da; color: #ced4da; border-color: #ced4da; }
.btn-outline-gray-500 { --btn-bg: #adb5bd; color: #adb5bd; border-color: #adb5bd; }
.btn-outline-gray-600 { --btn-bg: #6c757d; color: #6c757d; border-color: #6c757d; }
.btn-outline-gray-700 { --btn-bg: #495057; color: #495057; border-color: #495057; }
.btn-outline-gray-800 { --btn-bg: #343a40; color: #343a40; border-color: #343a40; }
.btn-outline-gray-900 { --btn-bg: #212529; color: #212529; border-color: #212529; }


/* === BLUE === */
.text-bg-blue-100 { background-color: #cfe2ff !important; color: #212529 !important; }
.text-bg-blue-200 { background-color: #9ec5fe !important; color: #212529 !important; }
.text-bg-blue-300 { background-color: #6ea8fe !important; color: #212529 !important; }
.text-bg-blue-400 { background-color: #3d8bfd !important; color: #212529 !important; }
.text-bg-blue-500 { background-color: #0d6efd !important; color: #fff !important; }
.text-bg-blue-600 { background-color: #0a58ca !important; color: #fff !important; }
.text-bg-blue-700 { background-color: #084298 !important; color: #fff !important; }
.text-bg-blue-800 { background-color: #052c65 !important; color: #fff !important; }
.text-bg-blue-900 { background-color: #031633 !important; color: #fff !important; }

/* === INDIGO === */
.text-bg-indigo-100 { background-color: #e0cffc !important; color: #212529 !important; }
.text-bg-indigo-200 { background-color: #c29ffa !important; color: #212529 !important; }
.text-bg-indigo-300 { background-color: #a370f7 !important; color: #212529 !important; }
.text-bg-indigo-400 { background-color: #8540f5 !important; color: #212529 !important; }
.text-bg-indigo-500 { background-color: #6610f2 !important; color: #fff !important; }
.text-bg-indigo-600 { background-color: #520dc2 !important; color: #fff !important; }
.text-bg-indigo-700 { background-color: #3d0a91 !important; color: #fff !important; }
.text-bg-indigo-800 { background-color: #290661 !important; color: #fff !important; }
.text-bg-indigo-900 { background-color: #140330 !important; color: #fff !important; }

/* === PURPLE === */
.text-bg-purple-100 { background-color: #e2d9f3 !important; color: #212529 !important; }
.text-bg-purple-200 { background-color: #c5b3e6 !important; color: #212529 !important; }
.text-bg-purple-300 { background-color: #a98eda !important; color: #212529 !important; }
.text-bg-purple-400 { background-color: #8c68cd !important; color: #212529 !important; }
.text-bg-purple-500 { background-color: #6f42c1 !important; color: #fff !important; }
.text-bg-purple-600 { background-color: #59359a !important; color: #fff !important; }
.text-bg-purple-700 { background-color: #432874 !important; color: #fff !important; }
.text-bg-purple-800 { background-color: #2c1a4d !important; color: #fff !important; }
.text-bg-purple-900 { background-color: #160d27 !important; color: #fff !important; }

/* === PINK === */
.text-bg-pink-100 { background-color: #f7d6e6 !important; color: #212529 !important; }
.text-bg-pink-200 { background-color: #efadce !important; color: #212529 !important; }
.text-bg-pink-300 { background-color: #e685b5 !important; color: #212529 !important; }
.text-bg-pink-400 { background-color: #de5c9d !important; color: #212529 !important; }
.text-bg-pink-500 { background-color: #d63384 !important; color: #fff !important; }
.text-bg-pink-600 { background-color: #ab296a !important; color: #fff !important; }
.text-bg-pink-700 { background-color: #801f4f !important; color: #fff !important; }
.text-bg-pink-800 { background-color: #561435 !important; color: #fff !important; }
.text-bg-pink-900 { background-color: #2b0a1a !important; color: #fff !important; }

/* === RED === */
.text-bg-red-100 { background-color: #f8d7da !important; color: #212529 !important; }
.text-bg-red-200 { background-color: #f1aeb5 !important; color: #212529 !important; }
.text-bg-red-300 { background-color: #ea868f !important; color: #212529 !important; }
.text-bg-red-400 { background-color: #e35d6a !important; color: #212529 !important; }
.text-bg-red-500 { background-color: #dc3545 !important; color: #fff !important; }
.text-bg-red-600 { background-color: #b02a37 !important; color: #fff !important; }
.text-bg-red-700 { background-color: #842029 !important; color: #fff !important; }
.text-bg-red-800 { background-color: #58151c !important; color: #fff !important; }
.text-bg-red-900 { background-color: #2c0b0e !important; color: #fff !important; }

/* === ORANGE === */
.text-bg-orange-100 { background-color: #ffe5d0 !important; color: #212529 !important; }
.text-bg-orange-200 { background-color: #fecba1 !important; color: #212529 !important; }
.text-bg-orange-300 { background-color: #feb272 !important; color: #212529 !important; }
.text-bg-orange-400 { background-color: #fd9843 !important; color: #212529 !important; }
.text-bg-orange-500 { background-color: #fd7e14 !important; color: #fff !important; }
.text-bg-orange-600 { background-color: #ca6510 !important; color: #fff !important; }
.text-bg-orange-700 { background-color: #984c0c !important; color: #fff !important; }
.text-bg-orange-800 { background-color: #653208 !important; color: #fff !important; }
.text-bg-orange-900 { background-color: #331904 !important; color: #fff !important; }

/* === YELLOW === */
.text-bg-yellow-100 { background-color: #fff3cd !important; color: #212529 !important; }
.text-bg-yellow-200 { background-color: #ffe69c !important; color: #212529 !important; }
.text-bg-yellow-300 { background-color: #ffda6a !important; color: #212529 !important; }
.text-bg-yellow-400 { background-color: #ffcd39 !important; color: #212529 !important; }
.text-bg-yellow-500 { background-color: #ffc107 !important; color: #212529 !important; }
.text-bg-yellow-600 { background-color: #cc9a06 !important; color: #fff !important; }
.text-bg-yellow-700 { background-color: #997404 !important; color: #fff !important; }
.text-bg-yellow-800 { background-color: #664d03 !important; color: #fff !important; }
.text-bg-yellow-900 { background-color: #332701 !important; color: #fff !important; }

/* === GREEN === */
.text-bg-green-100 { background-color: #d1e7dd !important; color: #212529 !important; }
.text-bg-green-200 { background-color: #a3cfbb !important; color: #212529 !important; }
.text-bg-green-300 { background-color: #75b798 !important; color: #212529 !important; }
.text-bg-green-400 { background-color: #479f76 !important; color: #212529 !important; }
.text-bg-green-500 { background-color: #198754 !important; color: #fff !important; }
.text-bg-green-600 { background-color: #146c43 !important; color: #fff !important; }
.text-bg-green-700 { background-color: #0f5132 !important; color: #fff !important; }
.text-bg-green-800 { background-color: #0a3622 !important; color: #fff !important; }
.text-bg-green-900 { background-color: #051b11 !important; color: #fff !important; }

/* === TEAL === */
.text-bg-teal-100 { background-color: #d2f4ea !important; color: #212529 !important; }
.text-bg-teal-200 { background-color: #a6e9d5 !important; color: #212529 !important; }
.text-bg-teal-300 { background-color: #79dfc1 !important; color: #212529 !important; }
.text-bg-teal-400 { background-color: #4dd4ac !important; color: #212529 !important; }
.text-bg-teal-500 { background-color: #20c997 !important; color: #fff !important; }
.text-bg-teal-600 { background-color: #1aa179 !important; color: #fff !important; }
.text-bg-teal-700 { background-color: #13795b !important; color: #fff !important; }
.text-bg-teal-800 { background-color: #0d503c !important; color: #fff !important; }
.text-bg-teal-900 { background-color: #06281e !important; color: #fff !important; }

/* === CYAN === */
.text-bg-cyan-100 { background-color: #cff4fc !important; color: #212529 !important; }
.text-bg-cyan-200 { background-color: #9eeaf9 !important; color: #212529 !important; }
.text-bg-cyan-300 { background-color: #6edff6 !important; color: #212529 !important; }
.text-bg-cyan-400 { background-color: #3dd5f3 !important; color: #212529 !important; }
.text-bg-cyan-500 { background-color: #0dcaf0 !important; color: #fff !important; }
.text-bg-cyan-600 { background-color: #0aa2c0 !important; color: #fff !important; }
.text-bg-cyan-700 { background-color: #087990 !important; color: #fff !important; }
.text-bg-cyan-800 { background-color: #055160 !important; color: #fff !important; }
.text-bg-cyan-900 { background-color: #032830 !important; color: #fff !important; }

/* === GRAY === */
.text-bg-gray-100 { background-color: #f8f9fa !important; color: #212529 !important; }
.text-bg-gray-200 { background-color: #e9ecef !important; color: #212529 !important; }
.text-bg-gray-300 { background-color: #dee2e6 !important; color: #212529 !important; }
.text-bg-gray-400 { background-color: #ced4da !important; color: #212529 !important; }
.text-bg-gray-500 { background-color: #adb5bd !important; color: #212529 !important; }
.text-bg-gray-600 { background-color: #6c757d !important; color: #fff !important; }
.text-bg-gray-700 { background-color: #495057 !important; color: #fff !important; }
.text-bg-gray-800 { background-color: #343a40 !important; color: #fff !important; }
.text-bg-gray-900 { background-color: #212529 !important; color: #fff !important; }





/* Мікроанімації Bootstrap */
.btn:hover {
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}
.btn:active {
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.form-control, .form-select {
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-control:hover, .form-select:hover {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.15rem rgba(13,110,253,0.25);
}
.form-control:focus, .form-select:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.15rem rgba(13,110,253,0.25);
}

.modal.fade .modal-dialog {
  transform: scale(0.95);
  transition: transform 0.2s ease-out;
}
.modal.show .modal-dialog {
  transform: scale(1);
}
.table-hover > tbody > tr {
  transition: background-color 0.15s ease;
}
.table-hover > tbody > tr:hover {
  background-color: rgba(13,110,253,0.05);
}

.nav-tabs {
    border-bottom: 2px solid rgba(0,0,0,0.08);
    gap: .2rem;
}
.nav-tabs .nav-link {
    /*border: none !important;*/
    border-radius: .15rem .15rem 0 0;
    padding: .55rem 1rem;
    font-weight: 500;
    color: #6c757d;
    background: transparent;
    transition: color .25s ease, background .25s ease, box-shadow .25s ease;
    position: relative;
}
.nav-tabs .nav-link:hover {
    color: #0d6efd;
    background: rgba(13,110,253,0.06);
}
.nav-tabs .nav-link.active {
    color: #0d6efd;
    font-weight: 500;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.06);
}
.nav-tabs .nav-link.active::after {
    content: "";
    position: absolute;
    left: 25%;
    right: 25%;
    bottom: -2px;
    height: 3px;
    background-color: #0d6efd;
    border-radius: 3px;
    transition: all .25s ease;
}
.nav-tabs .nav-link::after {
    content: "";
    position: absolute;
    left: 40%;
    right: 40%;
    bottom: -2px;
    height: 2px;
    background-color: transparent;
    border-radius: 2px;
    transition: all .25s ease;
}
.nav-tabs .nav-link:hover::after {
    background-color: color-mix(in srgb, currentColor 35%, transparent);
    left: 30%;
    right: 30%;
}

.nav-tabs .nav-link i {
    transition: transform .25s ease, opacity .25s ease;
}
.nav-tabs .nav-link:hover i {
    transform: translateY(-1px);
}
.navbar {
    /*background: linear-gradient(
        135deg,
        color-mix(in srgb, currentColor 15%, transparent),
        color-mix(in srgb, currentColor 30%, transparent)
    );*/
    border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent);
    box-shadow: 0 4px 16px color-mix(in srgb, currentColor 35%, transparent);
}




.mini-stat {
    height: 70px;
}
.mini-stat .card {
    border-radius: .5rem;
    box-shadow: none;
}
.mini-stat .card-body {
    padding: 0.4rem 0.75rem 0.75rem 0.75rem;
    line-height: 1.1;
}
.mini-stat .progress {
    height: 4px;
    border-radius: 0;
    margin-top: 4px;
}
.mini-stat .progress-bar {
    transition: width 0.8s ease;
}





@keyframes slideBorder {
    0% {
        transform: translateX(-100%);
        opacity: 0.5;
    }
    50% {
        transform: translateX(0%);
        opacity: 1;
    }
    100% {
        transform: translateX(0%);
        opacity: 0.7;
    }
}


.navbar-nav .nav-link {
    padding: 0.65rem 0.65rem 0.4rem 0.75rem;
    border-radius: 0.35rem;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.navbar-nav .dropdown-menu {
    padding: 0.4rem 0;
    /*margin-top: 0.25rem;*/
    box-shadow: 0 0 8px rgba(0,0,0,.6);
    border-radius: .35rem;
}
.navbar-nav .dropdown-item {
    padding: 0.35rem 1rem;
    border-radius: .35rem;
}
.navbar-nav .dropdown-item:hover {
    background: rgba(255,255,255,0.12);
}

/* Застосовується тільки на sm (≤767px) і нижче (xs) */
@media (max-width: 991px) {
	#offcanvasNavbar .nav-link {
			padding: 0.75rem 1rem; /* більше вертикального відступу */
			border-bottom: 1px solid rgba(255,255,255,0.1); /* тонка лінія-розділювач */
			border-radius: 0px !important;
	}
	#offcanvasNavbar .nav-link:last-child {
		border-bottom: none;
	}
	#offcanvasNavbar,#offcanvasNavbar * {
		font-size: 0.9rem !important;
	}

	#offcanvasNavbar .nav-link,
	#offcanvasNavbar .dropdown-item,
	#offcanvasNavbar .dropdown-toggle,
	#offcanvasNavbar .badge,
	#offcanvasNavbar .btn,
	#offcanvasNavbar .offcanvas-title,
	#offcanvasNavbar i,
	#offcanvasNavbar span,
	#offcanvasNavbar small {
		font-size: 0.9rem !important;
	}
	#offcanvasNavbar .badge {
		min-width: 16px;
		min-height: 16px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	#offcanvasNavbar .nav-link,	#offcanvasNavbar .dropdown-item {
		padding: 8px 10px !important;
	}
	#offcanvasNavbar .nav-link {
		transition: background-color 0.2s;
	}
	#offcanvasNavbar .nav-link:hover, #offcanvasNavbar .nav-link.active {
		background-color: rgba(255,255,255,0.1);
	}
	#offcanvasNavbarLabel {
		font-weight: bold;
	}
	#NavBarSearchform{
		padding: 0.75rem;
	}
}

.dropdown-menu {
    animation: fadeSlideIn 0.2s ease-out;
}

@keyframes fadeSlideIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}



.gr-car-marker{
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid #fff;
	box-shadow: 0 0 3px rgba(0,0,0,.5);
	color: #fff;
	font-size: 15px;
}
.gr-car-marker-success{ background: var(--bs-success); }
.gr-car-marker-warning{ background: var(--bs-warning); color: #212529; }
.gr-car-marker-danger{ background: var(--bs-danger); }
.gr-track-arrow{
	background: transparent;
	border: none;
	pointer-events: none;
}
.gr-track-arrow svg{
	display: block;
	overflow: visible;
	filter: drop-shadow(0 0 1px rgba(0,0,0,.35));
}
.gr-tracks-box{
	background: var(--bs-body-bg);
	color: var(--bs-body-color);
	min-width: 210px;
	max-width: 270px;
	padding: .35rem !important;
}
.gr-tracks-box .btn-link{
	text-decoration: none;
}
.gr-track-head{
	display: flex;
	align-items: center;
	gap: .35rem;
	padding-bottom: .3rem;
	margin-bottom: .3rem;
	border-bottom: 1px solid var(--bs-border-color);
	font-size: .78rem;
	font-weight: 600;
}
.gr-track-row{
	display: flex;
	align-items: center;
	gap: .25rem;
	padding: .1rem 0;
	font-size: .75rem;
}
.gr-track-row .gr-track-name{
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.gr-track-row .badge{
	flex: 0 0 auto;
	font-size: .62rem;
}
.gr-track-row .btn{
	flex: 0 0 auto;
	--bs-btn-padding-y: .05rem;
	--bs-btn-padding-x: .3rem;
	--bs-btn-font-size: .7rem;
	line-height: 1.3;
}
.gr-track-switch{
	margin: .35rem 0 0;
	padding-top: .3rem;
	border-top: 1px solid var(--bs-border-color);
	font-size: .74rem;
	min-height: auto;
}
.gr-track-switch .form-check-input{
	margin-top: .15rem;
}
.gr-track-pick{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .25rem;
	font-size: .75rem;
}
.gr-track-pick .form-select{
	width: auto;
	flex: 0 1 auto;
	font-size: .72rem;
	padding: .1rem 1.4rem .1rem .35rem;
}
.gr-track-pick .btn{
	--bs-btn-padding-y: .1rem;
	--bs-btn-padding-x: .35rem;
	--bs-btn-font-size: .72rem;
}
@media (max-width: 991.98px){
	#myModal{
		overflow-x: hidden;
	}
	#myModal .modal-dialog:not(.modal-fullscreen){
		width: auto !important;
		max-width: calc(100% - 1rem) !important;
		margin-left: .5rem !important;
		margin-right: .5rem !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		transform: none;
	}
	#myModal .modal-dialog.modal-fullscreen{
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		transform: none;
	}
	#myModal .modal-content{
		max-width: 100%;
	}
	#myModal .modal-header{
		flex-wrap: wrap;
		row-gap: .25rem;
	}
	#myModal .modal-title{
		min-width: 0;
		overflow-wrap: anywhere;
	}
	#myModal .modal-body{
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}
#grHelpModal{
	z-index: 1090;
}
.gr-help-backdrop{
	z-index: 1085;
}
#grHelpModal .gr-help-list li + li{
	margin-top: .35rem;
}
.leaflet-popup{
	min-width: 300px;
}
.leaflet-popup-content{
	width:unset !important;
}
.leaflet-container .sidepanel{
	max-width: 90%;
}
/* --- елементи керування leaflet у стилі системи ---------------------------
   Плашки були прибиті до білого з чорним текстом, тому на темній темі кнопки
   світились білим, а підписи в них зникали. Тепер усе через токени бутстрапа,
   а метрика кнопок та сама, шо в панелі схеми комутації. */
.leaflet-bar,
.leaflet-control-layers {
	background-color: var(--bs-body-bg);
	color: var(--bs-emphasis-color);
	border: 1px solid var(--bs-border-color);
	box-shadow: 0 .125rem .35rem rgba(0, 0, 0, .12);
	background-clip: padding-box;
}

.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 1px solid var(--bs-border-color);
	background-clip: padding-box;
}

.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar > div {
	color: inherit;
}

/* Кнопки смужки. Розмір і background-image НЕ чіпаємо: лінійка, повний екран
   і друк малюють свій значок саме фоновим спрайтом, і будь-який background
   у скороченій формі його стирає, а зміна розміру ріже спрайт мозаїкою.
   Тут тільки колір тексту й підкладка, щоб значки-шрифти було видно на темній. */
.leaflet-bar a,
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: var(--bs-body-bg);
	color: var(--bs-emphasis-color);
	border-bottom-color: var(--bs-border-color);
}

.leaflet-bar a:hover {
	background-color: var(--bs-tertiary-bg);
}

.leaflet-bar a:focus-visible {
	outline: 2px solid var(--bs-primary);
	outline-offset: -2px;
}

.leaflet-bar a.leaflet-disabled {
	background-color: var(--bs-secondary-bg);
	color: var(--bs-secondary-color);
}

.leaflet-control-scale-line {
	background: var(--bs-body-bg);
	color: var(--bs-body-color);
	border: 1px solid var(--bs-border-color);
	border-top: 0;
}

.leaflet-container .leaflet-control-attribution {
	background: var(--bs-body-bg);
	color: var(--bs-secondary-color);
}

.leaflet-container .leaflet-control-attribution a {
	color: var(--bs-link-color);
}


.progress-bar-vertical {
  width: 20px;
  min-height: 100px;
  display: flex;
  align-items: flex-end;
  float: left;
}

/* ТІЛЬКИ base layers (radio) */
.leaflet-control-layers-base {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2px 6px;
}

/* label без відступів */
.leaflet-control-layers-base label {
	margin: 0;
}

/* ховаємо radio */
.leaflet-control-layers-base
.leaflet-control-layers-selector[type="radio"] {
	display: none;
}

/* компактний вигляд */
.leaflet-control-layers-base label > span {
	border: 2px solid transparent;
	display: block;
	padding: 2px 4px;
	line-height: 1.1;
	border-radius: 3px;
	background: transparent;
	cursor: pointer;
	white-space: nowrap;
}

/* hover */
.leaflet-control-layers-base label:hover > span {
	background: var(--bs-secondary-bg);
	color: var(--bs-emphasis-color);
}

/* активний radio */
.leaflet-control-layers-base
.leaflet-control-layers-selector[type="radio"]:checked + span {
	border: 2px solid var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
	color: var(--bs-emphasis-color);
	padding: 2px 4px;
	line-height: 1.1;
	border-radius: 3px;
	cursor: pointer;
	white-space: nowrap;
}

/* overlays (checkbox) — як було */
.leaflet-control-layers-overlays {
	display: block;
}
/* щоб текст не "плив" */
.leaflet-control-layers-overlays label > span {
	padding: 2px 10px;
	line-height: 1.5;
	cursor: pointer;
	display: block;
	border: 2px solid transparent;
	border-radius: 3px;
	background: transparent;
}
/* ховаємо checkbox */
.leaflet-control-layers-overlays
.leaflet-control-layers-selector[type="checkbox"] {
	display: none;
}

/* hover */
.leaflet-control-layers-overlays label:hover > span {
	background: var(--bs-secondary-bg);
	color: var(--bs-emphasis-color);
}
/* вибраний шар підсвічуєм так само, як у базових */
.leaflet-control-layers-overlays
.leaflet-control-layers-selector[type="checkbox"]:checked + span {
	border-color: var(--bs-primary);
	background: var(--bs-primary-bg-subtle);
	color: var(--bs-emphasis-color);
}
/* активний маркер */
.leaflet-control-layers-overlays
.leaflet-control-layers-selector[type="checkbox"]:checked + span::before {
	content: "✔";
	opacity: 1;
	color: var(--bs-primary);
	margin-right: 4px;
}
.leaflet-control-layers-selector[type="checkbox"]:not(:checked) + span::before {
	content: "☐";
	opacity: .45;
	color: currentColor;
	margin-right: 4px;
}

/* --- прокрутка переліку шарів -----------------------------------------
   Шарів на мапі багато і розгорнутий список закривав пів екрана.
   Обмежуєм висоту всієї панелі, а базові шари і оверлеї получають
   свої власні смуги прокрутки.                                        */
.leaflet-control-layers-expanded {
	display: flex;
	flex-direction: column;
	max-height: calc(100vh - 140px);
	max-width: 340px;
	overflow: hidden;
	padding: 6px 8px 6px 6px;
}
.leaflet-control-layers-list {
	display: flex;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
}
.leaflet-control-layers-base,
.leaflet-control-layers-overlays {
	overflow-y: auto;
	overscroll-behavior: contain;
	padding-right: 4px;
}
.leaflet-control-layers-base { max-height: 26vh; flex: 0 1 auto; }
.leaflet-control-layers-overlays { max-height: 52vh; flex: 1 1 auto; }
.leaflet-control-layers-separator { flex: 0 0 auto; margin: 5px 0; }

.leaflet-control-layers-base::-webkit-scrollbar,
.leaflet-control-layers-overlays::-webkit-scrollbar { width: 6px; }
.leaflet-control-layers-base::-webkit-scrollbar-thumb,
.leaflet-control-layers-overlays::-webkit-scrollbar-thumb {
	background: rgba(128, 128, 128, .45);
	border-radius: 3px;
}
.leaflet-control-layers-base,
.leaflet-control-layers-overlays { scrollbar-width: thin; }

/* --- значки кнопок мапи  */
.leaflet-control-fullscreen a,
.leaflet-bar.leaflet-ruler,
.leaflet-bar.leaflet-ruler-clicked,
.leaflet-control-browser-print a,
.leaflet-control-layers-toggle {
	background-image: none !important;
	position: relative;
}

.leaflet-control-fullscreen a::before,
.leaflet-bar.leaflet-ruler::before,
.leaflet-bar.leaflet-ruler-clicked::before,
.leaflet-control-browser-print a::before,
.leaflet-control-layers-toggle::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: currentColor;
	-webkit-mask-image: var(--nc-map-ico);
	mask-image: var(--nc-map-ico);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 16px 16px;
	mask-size: 16px 16px;
	pointer-events: none;
}

/* повний екран */
.leaflet-control-fullscreen a {
	--nc-map-ico: url("vendor/bootstrap-icons/arrows-fullscreen.svg");
}
.leaflet-fullscreen-on .leaflet-control-fullscreen a,
.leaflet-container:fullscreen .leaflet-control-fullscreen a {
	--nc-map-ico: url("vendor/bootstrap-icons/fullscreen-exit.svg");
}

/* лінійка */
.leaflet-bar.leaflet-ruler,
.leaflet-bar.leaflet-ruler-clicked {
	--nc-map-ico: url("vendor/bootstrap-icons/rulers.svg");
	width: 30px;
	height: 30px;
	background-color: var(--bs-body-bg);
	color: var(--bs-emphasis-color);
	cursor: pointer;
}
.leaflet-bar.leaflet-ruler:hover {
	background-color: var(--bs-tertiary-bg);
}
/* лінійка увімкнена */
.leaflet-bar.leaflet-ruler-clicked {
	background-color: var(--bs-primary-bg-subtle);
	color: var(--bs-primary);
	border-color: var(--bs-primary) !important;
}
/* підказки лінійки */
.leaflet-tooltip.result-tooltip,
.leaflet-tooltip.moving-tooltip {
	background: var(--bs-body-bg);
	color: var(--bs-emphasis-color);
	border: 1px solid var(--bs-border-color);
	box-shadow: 0 .125rem .35rem rgba(0, 0, 0, .12);
	opacity: 1;
}
.leaflet-tooltip.result-tooltip {
	border-color: var(--bs-primary);
}
.leaflet-tooltip.result-tooltip.leaflet-tooltip-top::before,
.leaflet-tooltip.moving-tooltip.leaflet-tooltip-top::before {
	border-top-color: var(--bs-border-color);
}
.leaflet-tooltip.result-tooltip.leaflet-tooltip-bottom::before,
.leaflet-tooltip.moving-tooltip.leaflet-tooltip-bottom::before {
	border-bottom-color: var(--bs-border-color);
}

/* перелік шарів у згорнутому вигляді */
.leaflet-container a.leaflet-control-layers-toggle {
	--nc-map-ico: url("vendor/bootstrap-icons/stack.svg");
	color: var(--bs-emphasis-color);
}
.leaflet-control-layers-toggle::before {
	-webkit-mask-size: 20px 20px;
	mask-size: 20px 20px;
}
.leaflet-container a.leaflet-control-layers-toggle:hover {
	background-color: var(--bs-tertiary-bg);
}
.leaflet-container a.leaflet-control-layers-toggle:focus-visible,
.leaflet-bar.leaflet-ruler:focus-visible {
	outline: 2px solid var(--bs-primary);
	outline-offset: -2px;
}
.leaflet-control-layers-separator {
	border-top: 1px solid var(--bs-border-color);
}

/* --- друк мапи  */
.leaflet-control-browser-print,
.leaflet-control-browser-print a {
	background-color: var(--bs-body-bg) !important;
	color: var(--bs-emphasis-color) !important;
	border-color: var(--bs-border-color) !important;
}
.leaflet-control-browser-print a {
	--nc-map-ico: url("vendor/bootstrap-icons/printer.svg");
}
.leaflet-control-browser-print a:hover {
	background-color: var(--bs-tertiary-bg) !important;
}
/* перелік режимів друку */
.leaflet-control-browser-print .browser-print-holder {
	background-color: var(--bs-body-bg) !important;
	border: 1px solid var(--bs-border-color);
	border-left: 0;
}
.leaflet-control-browser-print .browser-print-mode {
	color: var(--bs-emphasis-color) !important;
	line-height: 26px;
}
.leaflet-control-browser-print .browser-print-holder:hover {
	background-color: var(--bs-tertiary-bg) !important;
}

/* --- моє місцезнаходження - */
.leaflet-control-locate a .leaflet-control-locate-location-arrow,
.leaflet-control-locate a .leaflet-control-locate-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	vertical-align: middle;
	background-image: none !important;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 16px 16px;
	mask-size: 16px 16px;
}
.leaflet-control-locate a .leaflet-control-locate-location-arrow {
	-webkit-mask-image: url("vendor/bootstrap-icons/crosshair.svg");
	mask-image: url("vendor/bootstrap-icons/crosshair.svg");
}
.leaflet-control-locate a .leaflet-control-locate-spinner {
	-webkit-mask-image: url("vendor/bootstrap-icons/arrow-clockwise.svg");
	mask-image: url("vendor/bootstrap-icons/arrow-clockwise.svg");
}
.leaflet-control-locate a {
	color: var(--bs-emphasis-color);
}
.leaflet-control-locate.active a .leaflet-control-locate-location-arrow {
	background-color: var(--bs-primary);
}
.leaflet-control-locate.following a .leaflet-control-locate-location-arrow {
	background-color: var(--bs-warning);
}

[data-bs-theme*="dark"] .leaflet-draw-toolbar a,
[data-bs-theme*="dark"] .leaflet-draw-actions a {
	filter: invert(1) hue-rotate(180deg);
}


.leaflet-control-layers-overlays label > span {
	white-space: normal;
	word-break: break-word;
}

@media (max-height: 700px) {
	.leaflet-control-layers-base { max-height: 20vh; }
	.leaflet-control-layers-overlays { max-height: 45vh; }
}


/* Віджет батарей*/
.widget-ips-battery-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
  gap: 16px;
  padding: 10px;
  /*max-width: 1000px;*/
  margin: auto;
  font-family: Arial, sans-serif;
  justify-items: center;
  content-visibility: auto;
  contain-intrinsic-size: 0 130px;
}

/* Обгортка для контакту */
.widget-ips-battery-wrapper {
  position: relative;
  width: fit-content;
}
/* Контакт */
.widget-ips-battery-cap {
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 16px;
  height: 6px;
  background: color-mix(in srgb, currentColor 30%, transparent);
  border-radius: 4px 4px 0 0;
}
.widget-ips-battery-cap.is-charging {
  background: var(--bs-success);
  box-shadow: 0 0 6px color-mix(in srgb, var(--bs-success) 60%, transparent);
}
.widget-ips-battery-cap.is-discharging {
  background: var(--bs-warning);
  box-shadow: 0 0 6px color-mix(in srgb, var(--bs-warning) 60%, transparent);
}
/* Корпус */
.widget-ips-battery {
  width: 44px;
  height: 90px;
  border: 2px solid color-mix(in srgb, currentColor 20%, transparent);
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.05);
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
  /*backdrop-filter: blur(4px); */
}
.widget-ips-battery:hover {
  transform: translateY(-2px);
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.1), 0 .35rem .75rem rgba(0,0,0,.18);
}
.widget-ips-battery.is-offline {
  border-color: var(--bs-danger);
  border-width: 3px;
}
.widget-ips-battery.is-disabled {
  border-color: var(--bs-primary);
  border-width: 3px;
}

/* Заповнення */
.widget-ips-battery-fill {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #4caf50 0%, #8bc34a 100%);
  /* transform замість height: не чіпає layout, лише композитинг на GPU */
  transform-origin: bottom;
  will-change: transform;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.widget-ips-battery.low .widget-ips-battery-fill {
  background: linear-gradient(180deg, #fbbf24 0%, #ea580c 100%);
}

.widget-ips-battery.medium .widget-ips-battery-fill {
  background: linear-gradient(to top, #ff9800, #ffeb3b);
}
/* Текст */
.widget-ips-battery-text {
  position: absolute;
  inset: 0;
  /*display: flex;*/
  display: grid;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 12px;
  font-weight: bold;
  text-shadow: 1px 1px 2px black;
  pointer-events: none;
  z-index: 2;
}
.plr-button {
	padding-left: 10px !important;
	padding-right: 10px !important;
}

.scroll-y-disable-scrollbar {
  overflow-y: auto;
  /* Firefox */
  scrollbar-width: none;
  /* IE / Edge (старі) */
  -ms-overflow-style: none;
}
/* Chrome, Safari */
.scroll-y-disable-scrollbar::-webkit-scrollbar {
  display: none;
}

.scroll-y-thin {
  overflow-y: auto;
  /* Firefox */
  scrollbar-width: thin;
  scrollbar-color: rgba(173, 217, 49, 0.3) transparent;
}
/* Chrome, Safari, Edge */
.scroll-y-thin::-webkit-scrollbar {
  width: 6px;
}
.scroll-y-thin::-webkit-scrollbar-track {
  background: transparent;
}
.scroll-y-thin::-webkit-scrollbar-thumb {
  background-color: rgba(173, 217, 49, 0.3);
  border-radius: 3px;
}

/* Перетворюємо всі алерти на стиль "Card" */
.alert {
    position: relative;
    background-color: var(--bs-card-bg) !important; /* Авто-фон для світлої/темної теми */
    border: none !important;
    border-radius: 3px !important; /* Стандартний радіус Bootstrap */
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; /* shadow-sm */
    padding: 0.75rem 1rem !important;
    color: inherit !important; /* Текст адаптується до теми сайту */
    flex-wrap: wrap; /* Дозволяє елементам переноситися, якщо мало місця */
}

/* Додаємо кольорову лінію зліва залежно від типу алерту */
.alert-primary { 
  border: 1px solid color-mix(in srgb, var(--bs-primary) 30%, transparent) !important;
  border-left: 5px solid var(--bs-primary) !important;
}

.alert-secondary { 
  border: 1px solid color-mix(in srgb, var(--bs-secondary) 30%, transparent) !important;
  border-left: 5px solid var(--bs-secondary) !important;
}

.alert-success { 
  border: 1px solid color-mix(in srgb, var(--bs-success) 30%, transparent) !important;
  border-left: 5px solid var(--bs-success) !important;
}

.alert-danger { 
  border: 1px solid color-mix(in srgb, var(--bs-danger) 30%, transparent) !important;
  border-left: 5px solid var(--bs-danger) !important;
}

.alert-warning { 
  border: 1px solid color-mix(in srgb, var(--bs-warning) 30%, transparent) !important;
  border-left: 5px solid var(--bs-warning) !important;
}

.alert-info { 
  border: 1px solid color-mix(in srgb, var(--bs-info) 30%, transparent) !important;
  border-left: 5px solid var(--bs-info) !important;
}

.alert-dark { 
  border: 1px solid color-mix(in srgb, var(--bs-dark) 30%, transparent) !important;
  border-left: 5px solid var(--bs-dark) !important;
}

.alert-very-danger {
  color: #9b1c1c;
  background-color: #fde8e8;
  border: 1px solid #f8b4b4 !important;
  border-left: 5px solid #e11d48 !important;
}

.alert-primary .bi { color: var(--bs-primary); }
.alert-success .bi { color: var(--bs-success); }
.alert-danger .bi { color: var(--bs-danger); }
.alert-warning .bi { color: var(--bs-warning); }
.alert-info .bi { color: var(--bs-info); }

/* Прибираємо посилання, щоб вони не зливалися */
.alert a {
    font-weight: 600;
    text-decoration: none;
    color: inherit;
}


/* Базовий стиль для кнопок керування, схожий на btn-close */
.btn-modal-control {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5em;
    height: 2.5em;
    padding: 0;
    color: #000; /* Колір іконок */
    background: transparent;
    border: none;
    border-radius: 0.375rem;
    opacity: 0.5; /* Стандартна прозорість як у btn-close */
    transition: all 0.15s ease-in-out;
}
.btn-modal-control:hover {
    color: #000;
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.05);
}
.grusher_image_16px{
	width:16px;
}

:root {
	--sla-ok:      hsl(147, 50%, 47%);
	--sla-warning: hsl(39, 100%, 50%);
	--sla-danger:  hsl(0, 90%, 65%);
	--sla-track:   hsl(0, 0%, 90%);
	--sla-text:    hsl(0, 0%, 35%);
}
.sla-card--ok .card-header i.bi-check-circle { color: var(--sla-ok); }
.sla-card--warning .card-header i.bi-exclamation-circle { color: var(--sla-warning); }
.sla-card--danger .card-header i.bi-exclamation-octagon-fill { color: var(--sla-danger); }
.sla-container {
	width: 100%;
	max-width: 250px;
	aspect-ratio: 1 / 1;
	margin: 0 auto;
	height: 85%;
}
.sla-container circle-progress {
	display: block;
	width: 100%;
	height: 100%;
}
.sla-container circle-progress::part(base) {
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
}
.sla-container circle-progress::part(circle) {
	stroke-width: 6;
	stroke: var(--sla-track);
}
.sla-container circle-progress::part(text) {
	fill: var(--sla-text);
	font-weight: 600;
}
.sla-card--ok circle-progress::part(value) { stroke: var(--sla-ok); }
.sla-card--warning circle-progress::part(value) { stroke: var(--sla-warning); }
.sla-card--danger circle-progress::part(value) { stroke: var(--sla-danger); }

.grid-stack-item > .grid-stack-item-content > .card {
	border-radius: 0px !important;
	border: none;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	
}
.grid-stack-item-content > .card > .card-header > a {
	color : currentColor;
}
.grid-stack-item-content>.card>.card-header {
    position: relative;
    overflow: hidden;
	background: transparent;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
/*.grid-stack-item-content>.card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}*/


/* === Live Search Dropdown === */
#livesearch-wrapper {
    position: relative;
}

#livesearch {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    width: 100%;
    min-width: 450px;
    max-width: 580px;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1050;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, rgba(0,0,0,.08));
    box-shadow: 0 12px 32px rgba(0,0,0,.16), 0 2px 8px rgba(0,0,0,.06);
    padding: 6px;
    opacity: 0;
    transform: translateY(-6px) scale(.98);
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease;
}

#livesearch.show {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

#livesearch::-webkit-scrollbar { width: 8px; }
#livesearch::-webkit-scrollbar-thumb {
    background: var(--bs-secondary-bg, #e2e2e2);
    border-radius: 8px;
}

.ls-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px 6px;
    font-size: .8rem;
    font-weight: 600;
    color: var(--bs-secondary-color, #6c757d);
}

.ls-header .ls-clear {
    cursor: pointer;
    color: var(--bs-danger, #dc3545);
    opacity: .75;
    transition: opacity .15s ease;
}
.ls-header .ls-clear:hover { opacity: 1; }

.ls-group-label {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px 4px;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--bs-secondary-color, #8a8f98);
}
.ls-group-label i { font-size: .85rem; }

.ls-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 9px;
    text-decoration: none;
    color: var(--bs-body-color, #212529);
    line-height: 1.3;
    transition: background-color .12s ease;
}
.ls-item:hover, .ls-item:focus {
    background: var(--bs-tertiary-bg, #f1f3f5);
    color: var(--bs-body-color, #212529);
    text-decoration: none;
}

.ls-dot {
    flex: 0 0 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}
.ls-dot.online  { background: #2fb344; box-shadow: 0 0 0 3px rgba(47,179,68,.15); }
.ls-dot.offline { background: #d63939; box-shadow: 0 0 0 3px rgba(214,57,57,.15); }

.ls-item .ls-main { font-weight: 600; white-space: nowrap; }
.ls-item .ls-meta {
    color: var(--bs-secondary-color, #868e96);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ls-divider {
    height: 1px;
    margin: 4px 6px;
    background: var(--bs-border-color, rgba(0,0,0,.06));
}

.ls-showall {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px;
    margin-top: 4px;
    border-radius: 9px;
    font-weight: 600;
    color: var(--bs-primary, #0d6efd);
    text-decoration: none;
}
.ls-showall:hover { background: var(--bs-tertiary-bg, #f1f3f5); color: var(--bs-primary, #0d6efd); }

.ls-empty {
    padding: 18px 10px;
    text-align: center;
    color: var(--bs-secondary-color, #868e96);
}








/* Базові налаштування таблиці (фон прозорий) */
table.diff {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    white-space: pre-wrap;
    font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace;
    font-size: 12px;
    line-height: 20px;
    border: 1px solid rgba(140, 149, 159, 0.2); /* Тонка прозора рамка */
    margin-bottom: 16px;
    background-color: transparent;
    
    counter-reset: old-line 0 new-line 0;
}

/* Налаштування комірки */
table.diff td {
    padding: 0 10px 0 15ch !important; 
    position: relative;
    min-height: 20px;
    vertical-align: middle;
    box-sizing: border-box;
}

/* Спільна база для колонок нумерації */
table.diff td::before,
table.diff td::after {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end; 
    font-size: 11px;
    color: inherit;
    opacity: 0.6; /* Робимо номери рядків злегка приглушеними */
    user-select: none;
    box-sizing: border-box;
    font-family: ui-monospace, SFMono-Regular, monospace;
}

/* Ліва колонка */
table.diff td::before {
    left: 0;
    width: 6.5ch;
    padding-right: 1ch;
}

/* Права колонка + вертикальна лінія розподілу */
table.diff td::after {
    left: 6.5ch;
    width: 7.5ch; 
    padding-right: 2.5ch; 
    border-right: 1px solid rgba(140, 149, 159, 0.2); 
}

/* --- 1. РЯДКИ БЕЗ ЗМІН (КОНТЕКСТ) --- */
table.diff tr:has(.diff-context) {
    background-color: transparent;
    counter-increment: old-line 1 new-line 1;
}
table.diff .diff-context::before { content: counter(old-line); background-color: transparent; }
table.diff .diff-context::after { content: counter(new-line); background-color: transparent; }

/* --- 2. ВИДЕНІ РЯДКИ (-) --- */
table.diff tr:has(.diff-deletedline) {
    counter-increment: old-line 1;
}
table.diff .diff-deletedline {
    /* Легке напівпрозоре червоне тонування, що підходить під будь-яку тему */
    background-color: rgba(248, 81, 73, 0.15); 
}
table.diff .diff-deletedline::before {
    content: counter(old-line);
    background-color: rgba(248, 81, 73, 0.1);
}
table.diff .diff-deletedline::after {
    content: "-";
    background-color: rgba(248, 81, 73, 0.1);
    color: var(--bs-danger); /* від теми, щоб читалось і в світлій */
    opacity: 1;
    font-weight: bold;
    justify-content: center;
    padding-left: 2ch;
}
table.diff .diff-deletedline del {
    background-color: rgba(248, 81, 73, 0.3);
    text-decoration: none;
}

/* --- 3. ДОДАНІ РЯДКИ (+) --- */
table.diff tr:has(.diff-addedline) {
    counter-increment: new-line 1;
}
table.diff .diff-addedline {
    /* Легке напівпрозоре зелене тонування */
    background-color: rgba(46, 160, 67, 0.15); 
}
table.diff .diff-addedline::before {
    content: ""; 
    background-color: rgba(46, 160, 67, 0.1);
}
table.diff .diff-addedline::after {
    content: counter(new-line) "+"; 
    background-color: rgba(46, 160, 67, 0.1);
}
/* Фарбуємо окремо плюс у зелений */
table.diff .diff-addedline::after {
    color: var(--bs-success); /* від теми, щоб читалось і в світлій */
    opacity: 1;
    font-weight: bold;
}
table.diff .diff-addedline ins {
    background-color: rgba(46, 160, 67, 0.3);
    text-decoration: none;
}

.gr-diff {
    overflow-x: auto;
    max-width: 100%;
}
.gr-diff table.diff {
    margin-bottom: 0;
}
/* нумерація лічильниками намальована під одну колонку тексту.
   у split-режимі колонок удвічі більше, тому там її не вмикаємо */
.gr-diff-split table.diff td::before,
.gr-diff-split table.diff td::after {
    content: none;
    display: none;
}
.gr-diff-split table.diff td {
    padding: 0 8px !important;
}
.gr-diff-split table.diff th {
    padding: 0 6px;
    font-size: 11px;
    font-weight: 400;
    text-align: right;
    color: var(--bs-secondary-color);
    background-color: var(--bs-tertiary-bg);
    border-right: 1px solid var(--bs-border-color);
    user-select: none;
    white-space: nowrap;
    vertical-align: middle;
    width: 1%;
}
.gr-diff-split table.diff thead th {
    text-align: center;
    font-weight: 600;
    color: var(--bs-body-color);
}
.gr-diff-split table.diff td:nth-child(2) {
    border-right: 2px solid var(--bs-border-color);
}
.gr-diff table.diff td:empty,
.gr-diff table.diff th:empty {
    width: 12px;
    min-width: 12px;
    max-width: 12px;
    padding: 0 !important;
}
.gr-diff table.diff td:empty::before,
.gr-diff table.diff td:empty::after {
    content: none;
    display: none;
}

body a.wn-loading:after,
body a.oc-loading:after,
body button.wn-loading:after,
body button.oc-loading:after,
body span.wn-loading:after,
body span.oc-loading:after {
	width: 1em;
	height: 1em;
	border: 0;
	border-radius: 0;
	opacity: 1;
	filter: none;
	background: url("img/Grusher_h_64.png") no-repeat center center;
	background-size: contain;
	transform-origin: 50% 50%;
	animation: grusher-loader-spin .8s linear infinite;
}

@keyframes grusher-loader-spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}


/* =====================================================================
   GRUSHER ENTERPRISE UI LAYER - початок
   Йде останнім у каскаді, тому перекриває все вище.
   Кольори тільки через --bs-*, щоб не поламати жодну тему
   (dark, dark_black, lux, pulse, yeti, sketchy, simplex, mdb).
   ===================================================================== */


:root{
	--gr-radius:    3px;
	--gr-hairline:  var(--bs-border-color);
	--gr-surface:   var(--bs-body-bg);
	--gr-surface-2: var(--bs-tertiary-bg);
	--gr-ink:       var(--bs-emphasis-color);
	--gr-ink-2:     var(--bs-secondary-color);
	--gr-ink-3:     var(--bs-tertiary-color);

	--gr-control-h: 30px;

	--gr-shadow-1:  0 1px 2px rgba(0, 0, 0, .07);
	--gr-shadow-2:  0 6px 20px rgba(0, 0, 0, .13);
	--gr-focus:     0 0 0 .2rem color-mix(in srgb, var(--bs-primary) 20%, transparent);
}

[data-bs-theme*="dark"]{
	--gr-shadow-1: 0 1px 2px rgba(0, 0, 0, .45);
	--gr-shadow-2: 0 8px 24px rgba(0, 0, 0, .6);
}

.table,
.badge,
.gr-num{
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum" 1;
}



.btn:hover,
.btn:active{
	box-shadow: none;
}
.card{
	box-shadow: var(--gr-shadow-1);
}
.card:hover{
	box-shadow: var(--gr-shadow-1) !important;
}

/* Дрібніші за fs-6 розміри. Класи вживались на кількох сторінках, а оголошення
   не було ніде - текст просто малювався дефолтним розміром. */
.fs-7 { font-size: .75rem; letter-spacing: .5px; }
.fs-8 { font-size: .65rem; letter-spacing: .5px; }

.badge{
	background-image: none !important;
	font-weight: 600;
	letter-spacing: .01em;
}

/* Бейдж без свого класу тексту: дефолтний білий напис на світлому фоні не
   читається. Сторожа на :not([class*="text-"]) тут не треба - її глушив будь-який
   text-nowrap чи text-truncate. Утиліти кольору в бутстрапі йдуть з !important,
   тому вони й так переб'ють ці правила, як їх поставити явно. */
.badge.bg-warning,
.badge.bg-info,
.badge.bg-light,
.badge.bg-white{
	color: #212529;
}
.badge.bg-body,
.badge.bg-body-secondary,
.badge.bg-body-tertiary,
.badge[class*="-subtle"]{
	color: var(--bs-emphasis-color);
}
.badge{
	vertical-align: baseline;
}

/* --- кнопки в шапці картки ------------------------------------------------
   По темі там уживались і btn-xs, і btn-sm, і дефолтний розмір: однакові за
   змістом кнопки на сусідніх сторінках виглядали по-різному. Розмір задаєм
   один раз тут, клас розміру в розмітці вже нічого не вирішує.
   !important - бо .btn-xs у темі оголошений саме так. */
.card-header .btn:not(.btn-close):not(.btn-lg){
	padding: .175rem .5rem !important;
	font-size: .8125rem !important;
	line-height: 1.45 !important;
	margin: 0;
}

.card-header .btn > .bi{
	vertical-align: -.075em;
}

.card-header .btn + .btn{
	margin-left: .25rem;
}

.card-header .btn-group > .btn + .btn,
.card-header .btn-group-vertical > .btn + .btn{
	margin-left: 0;
}

.form-text {
	margin-top: .15rem;
}
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible,
.dropdown-item:focus-visible,
.nav-link:focus-visible,
.page-link:focus-visible {
	outline: 2px solid var(--bs-primary);
	outline-offset: 1px;
}
.gr-empty {
	padding: 1.25rem .75rem;
	text-align: center;
	color: var(--bs-secondary-color);
}
.gr-empty > .bi {
	display: block;
	margin-bottom: .35rem;
	font-size: 1.75em;
	opacity: .5;
}
.table-sticky thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: var(--bs-tertiary-bg);
}

/* fs-7/8/9 навмисно не описуєм: по темі вони вживались як пусті класи,
   а якщо їм дати розмір - шрифти починають скакати там, де їх не чіпали */

/* свого розміру шрифту форма не задає - бере від блока, де живе (модаль, картка).
   а всі елементи всередині зводимо до цього ж розміру, щоб не було різнобою */
.gr-form-grid .form-control,
.gr-form-grid .form-select,
.gr-form-grid .input-group-text,
.gr-form-grid .form-label,
.gr-form-grid .form-check-label,
.gr-form-grid .btn,
.gr-form-grid label,
.gr-form-grid .select2-container .select2-selection__rendered,
.gr-form-grid .select2-container .select2-selection__placeholder{
	font-size: inherit;
}
.input-group > .select2-container{
	width: auto !important;
	flex: 1 1 auto;
	min-width: 0;
}
.input-group > .select2-container:not(:last-child) .select2-selection{
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.input-group > .select2-container:not(:first-child) .select2-selection{
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	margin-left: -1px;
}
.gr-form-grid .input-group{
	margin-bottom: .5rem;
	flex-wrap: nowrap;
}
.gr-form-grid .input-group > .input-group-text{
	flex: 0 0 auto;
	width: 10.5rem;
	max-width: 52%;
	justify-content: flex-start;
	background-color: var(--bs-tertiary-bg);
	border-color: var(--bs-border-color);
	color: var(--bs-secondary-color);
	font-weight: 500;
	white-space: normal;
	text-align: left;
	line-height: 1.25;
}
.gr-form-grid .input-group > .form-control,
.gr-form-grid .input-group > .form-select,
.gr-form-grid .input-group > .select2-container{
	min-width: 0;
	flex: 1 1 auto;
}
.gr-form-grid .input-group > .input-group-text.p-0,
.gr-form-grid .input-group > .btn{
	flex: 0 0 auto;
	width: auto;
	max-width: none;
}
.gr-form-grid .form-label{
	margin-bottom: .15rem;
	color: var(--bs-secondary-color);
}
.gr-form-grid .form-text{
	margin-top: .1rem;
}
.gr-form-grid .card > .card-body{
	padding: .5rem .65rem;
}
@media (max-width: 575.98px){
	.gr-form-grid .input-group > .input-group-text{ width: 7.5rem; }
}

.gr-ai-md{
	line-height: 1.55;
	word-break: break-word;
}
.gr-ai-md > :first-child{ margin-top: 0; }
.gr-ai-md > :last-child{ margin-bottom: 0; }
.gr-ai-md h1, .gr-ai-md h2, .gr-ai-md h3,
.gr-ai-md h4, .gr-ai-md h5, .gr-ai-md h6{
	font-size: 1.05em;
	font-weight: 600;
	margin: .85rem 0 .35rem;
	padding-bottom: .2rem;
	border-bottom: 1px solid var(--bs-border-color-translucent);
}
.gr-ai-md p{ margin: 0 0 .5rem; }
.gr-ai-md ul, .gr-ai-md ol{ margin: 0 0 .5rem; padding-left: 1.25rem; }
.gr-ai-md li{ margin-bottom: .15rem; }
.gr-ai-md code{
	padding: .1rem .25rem;
	border-radius: 2px;
	background: var(--bs-secondary-bg);
	color: var(--bs-emphasis-color);
}
.gr-ai-md pre{
	margin: 0 0 .5rem;
	padding: .5rem .65rem;
	border: 1px solid var(--bs-border-color);
	border-radius: 3px;
	background: var(--bs-body-tertiary-bg, var(--bs-secondary-bg));
	overflow-x: auto;
	white-space: pre-wrap;
}
.gr-ai-md pre code{ padding: 0; background: transparent; }
.gr-ai-md blockquote{
	margin: 0 0 .5rem;
	padding: .25rem .65rem;
	border-left: 3px solid var(--bs-primary-border-subtle);
	color: var(--bs-secondary-color);
}
.gr-ai-md table{ width: 100%; margin-bottom: .5rem; }
.gr-ai-md hr{ margin: .6rem 0; }
.gr-ai-md img{ max-width: 100%; height: auto; }

.modal-content{
	border-radius: var(--bs-border-radius-lg);
	box-shadow: var(--gr-shadow-2);
}

.form-control:focus,
.form-select:focus{
	border-color: color-mix(in srgb, var(--bs-primary) 55%, var(--bs-border-color));
	box-shadow: var(--gr-focus);
}
.table-hover > tbody > tr:hover{
	background-color: color-mix(in srgb, var(--bs-primary) 6%, transparent);
}
.nav-tabs{
	border-bottom: 1px solid var(--bs-border-color);
}



#monitoringCenter{
	border: 1px solid var(--gr-hairline);
	border-color: var(--gr-hairline) !important;
	border-radius: var(--gr-radius);
	box-shadow: none !important;
	overflow: hidden;
}

#monitoringCenter > .card-header:first-child{
	background: var(--gr-surface-2) !important;
	padding: .5rem .75rem 0 !important;
	border-bottom: 0 !important;
}
#monitoringCenter > .card-header:first-child > .d-flex{
	gap: .375rem !important;
	row-gap: .5rem !important;
	min-height: var(--gr-control-h);
}

#monitoringCenter .infoboard-brand-icon{
	width: 28px;
	height: 28px;
	background: var(--gr-surface);
	border: 1px solid var(--gr-hairline);
	border-radius: var(--gr-radius) !important;
	color: var(--gr-ink-2);
	font-size: .8125rem;
	box-shadow: none;
}
#monitoringCenter .infoboard-brand-icon + span{
	gap: 0 !important;
	margin-left: .125rem;
}

#monitoringCenter .infoboard-brand-icon + span > span:first-child{
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .01em;
	color: var(--gr-ink) !important;
}

#monitoringCenter .infoboard-brand-icon + span > span:last-child{
	margin-top: 3px !important;
	font-size: .625rem;
	font-weight: 500;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--gr-ink-3) !important;
	font-variant-numeric: tabular-nums;
	gap: .3rem !important;
}
#monitoringCenter #widgetCount{
	font-weight: 600;
	color: var(--gr-ink-2);
}

#monitoringCenter .infoboard-beat{
	width: 6px;
	height: 6px;
	margin-right: 1px;
	background: var(--bs-success);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-success) 20%, transparent);
	animation: gr-live 2.6s ease-in-out infinite;
}
#monitoringCenter .infoboard-beat.is-paused{
	background: var(--bs-warning);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-warning) 20%, transparent);
	animation: none;
}
@keyframes gr-live{
	0%, 100% { opacity: 1; }
	50%      { opacity: .3; }
}

#monitoringCenter > .card-header:first-child .infoboard-control{
	flex: 0 1 auto;
	min-width: 116px;
	max-width: 184px;
}
#monitoringCenter > .card-header:first-child .form-select-sm{
	height: var(--gr-control-h);
	padding: 0 1.6rem 0 .5rem;
	font-size: .75rem;
	line-height: calc(var(--gr-control-h) - 2px);
	color: var(--gr-ink);
	background-color: var(--gr-surface);
	background-position: right .4rem center;
	background-size: 11px 8px;
	border: 1px solid var(--gr-hairline);
	border-radius: var(--gr-radius);
	box-shadow: none;
}
#monitoringCenter > .card-header:first-child .form-select-sm:focus{
	border-color: color-mix(in srgb, var(--bs-primary) 50%, var(--gr-hairline));
	box-shadow: var(--gr-focus);
}

#monitoringCenter > .card-header:first-child .btn{
	--bs-btn-padding-y: 0;
	--bs-btn-padding-x: .5rem;
	--bs-btn-font-size: .8125rem;
	--bs-btn-border-color: var(--gr-hairline);
	--bs-btn-color: var(--gr-ink-2);
	--bs-btn-bg: var(--gr-surface);
	--bs-btn-hover-bg: var(--gr-surface-2);
	--bs-btn-hover-color: var(--gr-ink);
	--bs-btn-hover-border-color: var(--gr-hairline);
	--bs-btn-active-bg: var(--gr-surface-2);
	--bs-btn-active-color: var(--gr-ink);
	--bs-btn-active-border-color: var(--gr-hairline);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: var(--gr-control-h);
	min-width: var(--gr-control-h);
	margin-bottom: 0;
	border-radius: var(--gr-radius);
	box-shadow: none;
}

#monitoringCenter > .card-header:first-child .btn.btn-warning{
	--bs-btn-color: #000;
	--bs-btn-bg: var(--bs-warning);
	--bs-btn-border-color: var(--bs-warning);
	--bs-btn-hover-color: #000;
	--bs-btn-hover-bg: color-mix(in srgb, var(--bs-warning) 88%, #000);
	--bs-btn-hover-border-color: color-mix(in srgb, var(--bs-warning) 88%, #000);
}

#monitoringCenter > .card-header:first-child .btn.btn-outline-primary{
	--bs-btn-active-bg: var(--bs-primary);
	--bs-btn-active-border-color: var(--bs-primary);
	--bs-btn-active-color: #fff;
}
#monitoringCenter > .card-header:first-child .btn-check:checked + .btn{
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, .15);
}

#monitoringCenter > .card-header:first-child .btn-group{
	margin-left: .25rem;
	padding-left: .625rem;
	border-left: 1px solid var(--gr-hairline);
	border-radius: 0;
	box-shadow: none;
}
#monitoringCenter > .card-header:first-child .btn-group > .btn{
	border-radius: 0;
}
#monitoringCenter > .card-header:first-child .btn-group > .btn:first-child{
	border-top-left-radius: var(--gr-radius);
	border-bottom-left-radius: var(--gr-radius);
}
#monitoringCenter > .card-header:first-child .btn-group > .btn:last-child{
	border-top-right-radius: var(--gr-radius);
	border-bottom-right-radius: var(--gr-radius);
}

.spin-once{ animation: infoboard-spin .5s ease-in-out; }

#monitoringCenter .infoboard-progress{
	height: 2px;
	margin: .5rem -.75rem 0 !important;
	border-radius: 0;
	background: var(--gr-hairline);
}
#monitoringCenter .infoboard-progress-bar{
	background: linear-gradient(90deg, #3a5999, #aad426);
	border-radius: 0;
	box-shadow: none;
}
#monitoringCenter .infoboard-progress-bar.is-paused{
	background: color-mix(in srgb, var(--bs-warning) 70%, transparent);
}

#monitoringCenter #editPanelModeBlock{
	background: var(--gr-surface-2) !important;
	border-top: 1px solid var(--gr-hairline) !important;
	padding: .625rem .75rem !important;
}
#monitoringCenter #editPanelModeBlock .form-select-sm{
	height: var(--gr-control-h);
	padding: 0 1.6rem 0 .5rem;
	font-size: .75rem;
	line-height: calc(var(--gr-control-h) - 2px);
	border: 1px solid var(--gr-hairline);
	border-radius: var(--gr-radius);
}
#monitoringCenter #editPanelModeBlock .btn{
	--bs-btn-padding-y: 0;
	--bs-btn-padding-x: .55rem;
	--bs-btn-font-size: .8125rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: var(--gr-control-h);
	min-width: var(--gr-control-h);
	margin-bottom: 0;
	border-radius: var(--gr-radius);
	box-shadow: none;
}
#monitoringCenter #editPanelModeBlock .small{
	font-size: .6875rem;
	letter-spacing: .02em;
	color: var(--gr-ink-3) !important;
}

#monitoringCenter:fullscreen{
	border: 0;
}



#monitoringCenter .grid-stack-item-content > .card{
	background: var(--gr-surface);
	border: 1px solid var(--gr-hairline) !important;
	border-radius: var(--gr-radius) !important;
	box-shadow: none;
	transition: border-color .15s ease;
}
#monitoringCenter .grid-stack-item-content > .card:hover{
	transform: none;
	box-shadow: none !important;
	border-color: color-mix(in srgb, var(--gr-ink) 20%, var(--gr-hairline)) !important;
}
#monitoringCenter .grid-stack-item-content > .card > .card-header{
	display: flex;
	align-items: center;
	min-height: 30px;
	padding: .3rem .625rem !important;
	background: var(--gr-surface-2);
	border-bottom: 1px solid var(--gr-hairline);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .01em;
	color: var(--gr-ink);
}
#monitoringCenter .grid-stack-item-content > .card > .card-header i{
	color: var(--gr-ink-3);
	margin-right: .15rem;
}
#monitoringCenter .grid-stack-item-content > .card > .card-header a{
	color: var(--gr-ink-3) !important;
	line-height: 1;
}
#monitoringCenter .grid-stack-item-content > .card > .card-header a:hover,
#monitoringCenter .grid-stack-item-content > .card > .card-header a:hover i{
	color: var(--bs-primary) !important;
}

#monitoringCenter .border-anim::after{
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--bs-primary), transparent);
	opacity: .85;
}

#monitoringCenter .widget-first-appear{ animation: gr-widget-in .2s ease-out; }
@keyframes gr-widget-in{
	from { opacity: 0; }
	to   { opacity: 1; }
}

#monitoringCenter .skeleton-widget .skeleton-header,
#monitoringCenter .skeleton-widget .skeleton-line{
	border-radius: 2px;
	background: linear-gradient(
		90deg,
		color-mix(in srgb, var(--gr-ink) 6%, transparent) 25%,
		color-mix(in srgb, var(--gr-ink) 13%, transparent) 37%,
		color-mix(in srgb, var(--gr-ink) 6%, transparent) 63%
	);
	background-size: 400% 100%;
}
#monitoringCenter .skeleton-widget .skeleton-header{ height: 26px; }

#gridCont.edit-mode-active .grid-stack-item{
	outline: 1px dashed color-mix(in srgb, var(--bs-primary) 55%, transparent);
	outline-offset: -3px;
	background: color-mix(in srgb, var(--bs-primary) 4%, transparent);
}
#gridCont.edit-mode-active .grid-stack-item-content > .card > .card-header{
	background: color-mix(in srgb, var(--bs-primary) 8%, var(--gr-surface-2));
}

#monitoringCenter .ui-resizable-handle{
	opacity: 0;
	transition: opacity .15s ease;
}
#gridCont.edit-mode-active .ui-resizable-handle{ opacity: .5; }
#gridCont.edit-mode-active .grid-stack-item:hover .ui-resizable-handle{ opacity: 1; }



.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{
	background-color: var(--bs-body-bg) !important;
	border: 1px solid var(--bs-border-color) !important;
	border-radius: var(--gr-radius) !important;
	color: var(--bs-body-color);
	transition: border-color .15s ease, box-shadow .15s ease;
}
.select2-container--default .select2-selection--single{ height: 31px !important; }
.select2-container--default .select2-selection--single .select2-selection__rendered{
	padding-left: .5rem;
	font-size: .8125rem;
	line-height: 29px !important;
	color: var(--bs-body-color) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{ height: 29px !important; }
.select2-container--default .select2-selection--single .select2-selection__placeholder{ color: var(--bs-tertiary-color) !important; }
.select2-container--default .select2-selection--single:hover,
.select2-container--default .select2-selection--multiple:hover{
	border-color: color-mix(in srgb, var(--bs-primary) 40%, var(--bs-border-color)) !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple{
	border-color: color-mix(in srgb, var(--bs-primary) 55%, var(--bs-border-color)) !important;
	box-shadow: var(--gr-focus);
	outline: 0;
}

.select2-dropdown{
	background: var(--bs-body-bg);
	border: 1px solid var(--bs-border-color);
	border-radius: var(--gr-radius);
	box-shadow: var(--gr-shadow-2);
	overflow: hidden;
}
.select2-container--default .select2-results > .select2-results__options{
	background: transparent !important;
	padding: 4px !important;
	max-height: 264px;
	scrollbar-width: thin;
}
.select2-container .select2-results__option{
	padding: 4px 8px !important;
	font-size: .8125rem !important;
	border-radius: 2px;
	color: var(--bs-body-color);
}
.select2-container--default .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted[aria-selected]{
	background-color: color-mix(in srgb, var(--bs-primary) 14%, transparent) !important;
	color: var(--bs-emphasis-color) !important;
}
.select2-container--default .select2-results__option--selected{
	background-color: color-mix(in srgb, var(--bs-primary) 8%, transparent) !important;
	color: var(--bs-body-color) !important;
	font-weight: 600;
}
.select2-container--default .select2-results__option[aria-disabled="true"]{ color: var(--bs-tertiary-color); }
.select2-container--default .select2-results__group{
	padding: 6px 8px 4px;
	font-size: .625rem;
	font-weight: 600;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--bs-tertiary-color);
}
.select2-container--default .select2-search--dropdown{
	padding: 4px !important;
	border-bottom: 1px solid var(--bs-border-color);
}
.select2-container--default .select2-search--dropdown .select2-search__field{
	padding: 3px 6px;
	font-size: .8125rem;
	background: var(--bs-body-bg) !important;
	border: 1px solid var(--bs-border-color) !important;
	border-radius: var(--gr-radius);
	color: var(--bs-body-color) !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus{
	border-color: color-mix(in srgb, var(--bs-primary) 55%, var(--bs-border-color)) !important;
	outline: 0;
}
.select2-container .select2-results__option{
	white-space: normal;
	overflow-wrap: anywhere;
}
.select2-dropdown{
	box-sizing: border-box;
	max-width: 100vw;
}
.select2-container--default .select2-search--inline .select2-search__field{
	max-width: 100%;
	box-sizing: border-box;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	vertical-align: bottom;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice{
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-top: 4px;
	padding: 1px 6px;
	font-size: .75rem;
	line-height: 1.35;
	background-color: var(--bs-secondary-bg) !important;
	border: 1px solid var(--bs-border-color) !important;
	border-radius: 2px !important;
	color: var(--bs-body-color);
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
	position: static !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1rem;
	height: 1rem;
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 0 !important;
	border: 0;
	border-right: 0 !important;
	background: transparent !important;
	font-size: .9rem;
	line-height: 1;
	color: var(--bs-secondary-color);
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{ color: var(--bs-danger); background: transparent !important; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__display{
	padding-left: 0 !important;
	padding-right: 0 !important;
	cursor: default;
}



#toast-container > div{
	opacity: 1 !important;
	padding: 12px 14px 12px 46px !important;
	font-size: .8125rem;
	border-radius: var(--bs-border-radius) !important;
	border-left: 3px solid transparent;
	box-shadow: var(--gr-shadow-2) !important;
	background-position: 14px center !important;
	background-size: 18px 18px;
}
#toast-container > div:hover{ box-shadow: var(--gr-shadow-2) !important; }
#toast-container > .toast-success{ border-left-color: var(--bs-success); }
#toast-container > .toast-error{ border-left-color: var(--bs-danger); }
#toast-container > .toast-warning{ border-left-color: var(--bs-warning); }
#toast-container > .toast-info{ border-left-color: var(--bs-info); }
.toast-title{
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .01em;
}
.toast-message{ font-size: .8125rem; line-height: 1.4; }
.toast-progress{ height: 2px; opacity: .45; }



.bootstrap-table .table > thead > tr > th{
	vertical-align: middle;
	font-weight: 600;
	font-size: .8125rem;
	letter-spacing: .01em;
	white-space: nowrap;
	border-bottom: 2px solid var(--bs-border-color);
}
.bootstrap-table .pagination .page-link{
	font-size: .8125rem;
	border-radius: var(--gr-radius) !important;
}
.bootstrap-table .fixed-table-pagination .pagination-detail,
.bootstrap-table .fixed-table-pagination .pagination-info{
	font-size: .75rem;
	color: var(--bs-secondary-color);
}
.bootstrap-table .no-records-found td{
	font-size: .8125rem;
	color: var(--bs-tertiary-color);
}
.bootstrap-table .fixed-table-toolbar{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .35rem;
	margin-bottom: .5rem;
}
.bootstrap-table .fixed-table-toolbar::after{ content: none; }
.bootstrap-table .fixed-table-toolbar > .bs-bars,
.bootstrap-table .fixed-table-toolbar > .columns{
	float: none;
	margin: 0;
	padding: 0;
}
.bootstrap-table .fixed-table-toolbar > .search{
	float: none;
	margin: 0 0 0 auto;
	padding: 0;
}
.bootstrap-table .fixed-table-toolbar > .columns:last-child{
	margin-left: auto;
}
.bootstrap-table .fixed-table-toolbar .search .input-group,
.bootstrap-table .fixed-table-toolbar .search input{
	width: auto;
	min-width: 12rem;
	max-width: 100%;
}
.bootstrap-table .fixed-table-toolbar .btn,
.bootstrap-table .fixed-table-toolbar .form-control,
.bootstrap-table .fixed-table-toolbar .form-select,
.bootstrap-table .fixed-table-toolbar .search input{
	height: 1.75rem;
	padding: 0 .45rem;
	font-size: .75rem;
	line-height: 1.4;
	border-radius: var(--gr-radius);
}
.bootstrap-table .fixed-table-toolbar .btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .25rem;
}
.bootstrap-table .fixed-table-toolbar .btn i{ font-size: .8125rem; line-height: 1; }
.bootstrap-table .fixed-table-toolbar .btn-group > .btn:not(:first-child){
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.bootstrap-table .fixed-table-toolbar .btn-group > .btn:not(:last-child){
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
@media (max-width: 575.98px){
	.bootstrap-table .fixed-table-toolbar > .search{
		margin-left: 0;
		width: 100%;
	}
	.bootstrap-table .fixed-table-toolbar .search .input-group,
	.bootstrap-table .fixed-table-toolbar .search input{ width: 100%; }
}

.bootstrap-table .fixed-table-container{
	border: 1px solid var(--bs-border-color);
	border-radius: var(--gr-radius);
}
.bootstrap-table .fixed-table-container .table{
	margin-bottom: 0;
	border-color: var(--bs-border-color-translucent);
	--bs-table-hover-bg: var(--bs-secondary-bg);
}
.bootstrap-table .table > thead > tr > th{
	background: var(--bs-tertiary-bg);
	color: var(--bs-emphasis-color);
	border-top: 0;
	border-bottom: 1px solid var(--bs-border-color);
}
.bootstrap-table .table > thead > tr > th:first-child{
	border-left: 0;
	border-top-left-radius: var(--gr-radius);
}
.bootstrap-table .table > thead > tr > th:last-child{
	border-right: 0;
	border-top-right-radius: var(--gr-radius);
}
.bootstrap-table .table > tbody > tr > td{
	vertical-align: middle;
	border-color: var(--bs-border-color-translucent);
}
.bootstrap-table .table > tbody > tr > td:first-child,
.bootstrap-table .table > tfoot > tr > th:first-child{ border-left: 0; }
.bootstrap-table .table > tbody > tr > td:last-child,
.bootstrap-table .table > tfoot > tr > th:last-child{ border-right: 0; }
.bootstrap-table .table > tbody > tr:last-child > td{ border-bottom: 0; }
.bootstrap-table .table > tbody > tr.selected > td{
	background-color: var(--bs-primary-bg-subtle);
}
.bootstrap-table .table > tfoot > tr > th{
	background: var(--bs-tertiary-bg);
	border-top: 1px solid var(--bs-border-color);
	font-weight: 600;
}
/* коли таблиця має свою висоту (data-height) - шапка лишається видимою при скролі.
   безумовний overflow на .fixed-table-body не ставим, бо тоді ріже меню в клітинках */
.bootstrap-table .fixed-table-container.fixed-height .fixed-table-body thead th{
	position: sticky;
	top: 0;
	z-index: 2;
	background: var(--bs-tertiary-bg);
}
.bootstrap-table.gr-table-nogrow .fixed-table-body{
	overflow: unset;
	height: auto;
}
.bootstrap-table .fixed-table-pagination{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .35rem;
	margin-top: .5rem;
}
.bootstrap-table .fixed-table-pagination > .pull-left,
.bootstrap-table .fixed-table-pagination > .pull-right{
	float: none;
	margin: 0;
}
.bootstrap-table .fixed-table-pagination > .pull-right{ margin-left: auto; }
/* перелік ONU по інтерфейсу росте на всю висоту, свій скрол там тільки мішає
   (раніше це саме робив інлайновий style із партіала, але глобально на всі таблиці) */
#capture_onu_list_by_iface .bootstrap-table .fixed-table-container .fixed-table-body{
	overflow-x: unset;
	overflow-y: unset;
	height: 100%;
}

.gr-cli .gr-cli-dots{
	display: inline-flex;
	gap: 3px;
	flex-shrink: 0;
}
.gr-cli .gr-cli-dots > i{
	width: 8px;
	height: 8px;
	border-radius: 50%;
	opacity: .6;
}
.gr-cli > .card-body > pre{
	max-height: 60vh;
	overflow: auto;
	background: var(--bs-body-bg);
}



.tooltip{
	--bs-tooltip-bg: var(--bs-emphasis-color);
	--bs-tooltip-color: var(--bs-body-bg);
	--bs-tooltip-opacity: 1;
	--bs-tooltip-border-radius: var(--gr-radius);
	--bs-tooltip-font-size: .75rem;
	--bs-tooltip-padding-x: .5rem;
	--bs-tooltip-padding-y: .25rem;
	--bs-tooltip-max-width: 260px;
}
[data-bs-theme*="dark"] .tooltip{
	--bs-tooltip-bg: var(--bs-secondary-bg);
	--bs-tooltip-color: var(--bs-emphasis-color);
}
.tooltip-inner{ letter-spacing: .01em; }

.popover{
	--bs-popover-border-color: var(--bs-border-color);
	--bs-popover-border-radius: var(--bs-border-radius);
	--bs-popover-font-size: .8125rem;
	--bs-popover-header-font-size: .8125rem;
	--bs-popover-header-bg: var(--bs-tertiary-bg);
	box-shadow: var(--gr-shadow-2);
}
.popover-header{ font-weight: 600; letter-spacing: .01em; }

.dropdown-menu{
	--bs-dropdown-item-padding-y: .3rem;
	border-color: var(--bs-border-color);
	border-radius: var(--bs-border-radius);
	box-shadow: var(--gr-shadow-2);
}
.dropdown-header{
	font-size: .625rem;
	font-weight: 600;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--bs-tertiary-color);
}



#monitoringCenter .card-body,
.select2-results__options,
.table-responsive,
.dropdown-menu,
.offcanvas-body,
.modal-body{
	scrollbar-width: thin;
	scrollbar-color: color-mix(in srgb, var(--gr-ink) 22%, transparent) transparent;
}
#monitoringCenter .card-body::-webkit-scrollbar,
.select2-results__options::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar,
.dropdown-menu::-webkit-scrollbar,
.offcanvas-body::-webkit-scrollbar,
.modal-body::-webkit-scrollbar{
	width: 8px;
	height: 8px;
}
#monitoringCenter .card-body::-webkit-scrollbar-thumb,
.select2-results__options::-webkit-scrollbar-thumb,
.table-responsive::-webkit-scrollbar-thumb,
.dropdown-menu::-webkit-scrollbar-thumb,
.offcanvas-body::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb{
	border-radius: 4px;
	background: color-mix(in srgb, var(--gr-ink) 20%, transparent);
}
#monitoringCenter .card-body::-webkit-scrollbar-track,
.select2-results__options::-webkit-scrollbar-track,
.table-responsive::-webkit-scrollbar-track,
.dropdown-menu::-webkit-scrollbar-track,
.offcanvas-body::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track{
	background: transparent;
}



@media (max-width: 767.98px){
	#monitoringCenter > .card-header:first-child .infoboard-control{
		flex: 1 1 100%;
		max-width: none;
	}
	#monitoringCenter > .card-header:first-child .btn-group{
		margin-left: 0;
		padding-left: 0;
		border-left: 0;
	}
}



@media (prefers-reduced-motion: reduce){
	#monitoringCenter .infoboard-beat,
	#monitoringCenter .border-anim::after,
	#monitoringCenter .skeleton-widget .skeleton-header,
	#monitoringCenter .skeleton-widget .skeleton-line,
	#monitoringCenter .widget-first-appear,
	.spin-once{
		animation: none !important;
	}
	#monitoringCenter .infoboard-progress-bar{ transition: none; }
}


.gr-file-drop{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .15rem;
	width: 100%;
	min-height: 92px;
	padding: .75rem;
	margin: 0;
	text-align: center;
	cursor: pointer;
	border: 1px dashed var(--bs-border-color);
	border-radius: var(--gr-radius, .375rem);
	background: var(--bs-tertiary-bg);
	color: var(--bs-secondary-color);
	transition: border-color .15s ease, background-color .15s ease;
}
.gr-file-drop:hover,
.gr-file-drop.is-over{
	border-color: color-mix(in srgb, var(--bs-primary) 55%, var(--bs-border-color));
	background: color-mix(in srgb, var(--bs-primary) 6%, var(--bs-tertiary-bg));
}
.gr-file-drop i{ font-size: 1.35rem; line-height: 1; }
.gr-file-drop-t{ font-size: .8125rem; color: var(--bs-body-color); }
.gr-file-drop-s{ font-size: .6875rem; }

.gr-file-picked{ display: flex; flex-wrap: wrap; gap: .5rem; }
.gr-file-pick{
	display: flex;
	align-items: center;
	gap: .5rem;
	max-width: 100%;
	padding: .25rem .5rem;
	border: 1px solid var(--bs-border-color);
	border-radius: var(--gr-radius, .375rem);
	background: var(--bs-body-bg);
	font-size: .75rem;
}
.gr-file-pick img{ width: 32px; height: 32px; object-fit: cover; border-radius: 3px; flex-shrink: 0; }
.gr-file-pick i{ font-size: 1.1rem; flex-shrink: 0; }
.gr-file-pick .gr-file-pick-n{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 190px; }
.gr-file-pick.is-bad{ border-color: var(--bs-danger); color: var(--bs-danger); }

.gr-file-grid{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: .5rem;
}
.gr-file-card{
	display: flex;
	align-items: center;
	gap: .5rem;
	padding: .4rem;
	border: 1px solid var(--bs-border-color);
	border-radius: var(--gr-radius, .375rem);
	background: var(--bs-body-bg);
	min-width: 0;
}
.gr-file-card:hover{ border-color: color-mix(in srgb, var(--bs-primary) 35%, var(--bs-border-color)); }
.gr-file-thumb{
	width: 44px;
	height: 44px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	background: var(--bs-tertiary-bg);
	overflow: hidden;
}
.gr-file-thumb img{ width: 100%; height: 100%; object-fit: cover; cursor: pointer; }
.gr-file-thumb i{ font-size: 1.4rem; cursor: pointer; }
.gr-file-meta{ min-width: 0; flex-grow: 1; }
.gr-file-name{ font-size: .8125rem; }
.gr-file-sub{ font-size: .6875rem; }
.gr-file-act{ flex-shrink: 0; display: flex; align-items: center; }

.gr-zoom-low .gr-track-arrow{ display: none !important; }

/* --- згортання блоків у шапці картки --- */
.gr-collapse-head {
	cursor: pointer;
}
.gr-collapse-head:hover .gr-collapse-caret,
.gr-collapse-head:focus-visible .gr-collapse-caret {
	color: var(--bs-primary);
}
.gr-collapse-caret {
	transition: transform .15s ease-in-out;
	color: var(--bs-secondary-color);
}
.gr-collapse-head[aria-expanded="true"] .gr-collapse-caret {
	transform: rotate(180deg);
}