.tmi-modal-selects .btn.selected,
.tmi.multi-select .tmi-autocomplete-items div:hover,
.tmi.multi-select .tmi-autocomplete-items div.tmi-autocomplete-active {
    background-color: var(--tm-info) !important;
    color: var(--tm-cream) !important;
    border-radius: var(--tm-border-radius);
}

.tmi-modal-selects .modal-body .btn.selected:hover {
    color: var(--tm-white) !important;
}

.tmi-modal-selects .btn.selected::before{
	content: "\f00c";
	font-family: var(--tm-font-awesome-family);
	font-weight: 900;
	font-size: 21px;
	position: absolute;
	right: 1.2em;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}

.tm-view.tmi u, .tm-view.tmi strong {
    text-decoration-color: var(--tm-cream);
}

.tmi-autocomplete-items {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    justify-self: center;
    border: 1px solid var(--tm-info);
    border-radius: var(--tm-border-radius) !important;
    overflow: hidden;
    background: var(--tm-cream);
    max-height: 150px;
    overflow-y: auto;
    z-index: 1000;
    scrollbar-width: none; 
    -ms-overflow-style: none;
}

/* Hide scrollbar for webkit browsers */
.tmi-autocomplete-items::-webkit-scrollbar {
    display: none;
}

.tmi-autocomplete-items div {
    cursor: pointer;
    background: transparent !important;
    color: var(--tm-info);
    font-weight: 300;
}

.tmi-autocomplete-active,
.tmi-autocomplete-items div:hover {
    background-color: var(--tm-info) !important;
} 

.interest-remove-pending {
    background: var(--tm-danger) !important;
    color: var(--tm-white) !important;
    text-decoration: line-through;
    opacity: 0.8;
    cursor: pointer;
}

.interest-input-item {
    padding: 0;
  }

.deck-dots {
    gap: var(--tm-gap, 0.5rem);
}
.deck-dot {
    display: inline-block;
    width: var(--tm-dot-size, 10px);
    height: var(--tm-dot-size, 10px);
    border-radius: var(--tm-border-radius-pill, 50%);
    background: var(--tm-primary-25);
    margin: 0 var(--tm-dot-margin, 3px);
    transition: background var(--tm-transition, 0.2s);
}
.deck-dot.active {
    background: var(--tm-primary);
}

.tm-modal {
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    background: var(--tm-background-50);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
  }
  
.tm-modal-box {
    background: var(--tm-white);
    border: 1px solid var(--tm-info);
    border-radius: var(--tm-border-radius-xl);
    padding: 2.5rem 1rem 1.5rem 1rem;
    min-width: 320px;
    max-width: 90vw;
    position: relative;
  }
/* Added based on feedback */
.tmi-card {
    background: var(--tm-gray-100);
    border: 2px solid var(--tm-primary);
    border-radius: var(--tm-border-radius-xl);
}

.tmi.multi-select .input-group.tmi-input-group {
    position: relative;
    border: 1px solid var(--tm-primary);
    border-radius: var(--tm-border-radius);
    background: var(--tm-cream);
    box-shadow: none;
    overflow: visible;
}

.tmi-input-group {
    border: none;
    box-shadow: none;
    background: transparent;
    outline: none;
}
.tmi-input-group {
    border: none;
    box-shadow: none;
    outline: none;
}
.tmi-input-group .input-group-text {
    background: transparent;
    border: none;
    box-shadow: none;
}

.tmi-chip { 
    background: var(--tm-info);
    color: var(--tm-cream);
    cursor: pointer;
    font-size: var(--tm-font-size) !important;
    padding-left: 0.675rem !important;
}

.tmi-chip-no-intensity {
    padding-right: 1.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.tmi-interest-level {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
    border: 1px solid var(--tm-cream) !important;
    min-width: 2.1em;
    height: 2.1em;
    box-sizing: border-box;
    padding: 0 0.5em;
    font-weight: normal !important;
    font-size: 1em !important;
}

.tmi-drag-handle {
    cursor: grab;
}

.tmi-number-input {
    background-color: var(--tm-white) !important;
    border:  1px solid var(--tm-primary);;
}

.tmi-level-badge {
    min-width: 2.2rem;
}

.tmi-modal-level-btn {
    font-size: var(--tm-btn-font-size) !important;
    font-weight: var(--tm-btn-font-weight) !important;
    border-color: var(--tm-info) !important;
    background: var(--tm-cream) !important;
    color: var(--tm-info) !important;
}

.tmi-modal-level-btn .tmi-level-badge {
  color: var(--tm-info);
  border: none;
}

.tmi-modal-level-btn.btn-primary .tmi-level-badge {
  color: var(--tm-white);
}

.tmi-btn-cream {
    background: var(--tm-cream) !important;
    color: var(--tm-primary) !important;
    border: 1px solid var(--tm-primary);
}

.tmi-btn-cream:hover, .tmi-btn-cream:focus {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
    border-color: var(--tm-info) !important;
}

.tmi-input-group{
    background-color: var(--tm-white);
    border: 2px solid var(--tm-primary) !important;
}

.tmi-search-icon{
    width: 10%; 
    background-color:var(--tm-white) !important;
}

.tmi-form-control{
    background-color: var(--tm-white) !important;
    border: none;
}

.tmi-clear-icon {
  background: var(--tm-white) !important;
  border-top-right-radius: var(--tm-border-radius-xl) !important;
  border-bottom-right-radius: var(--tm-border-radius-xl) !important;;
  color: var(--tm-primary);
  font-size: 1.1em;
  padding: 0 0.5em;
  cursor: pointer;
}
.tmi-clear-icon:hover {
    cursor: pointer;
}

.btn-tm-white {
  background-color: var(--tm-white) !important;
  color: var(--tm-primary) !important;
  border:2px solid var(--tm-primary) !important;
}

.btn-tm-white:hover,
.btn-tm-white:focus {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
    border-color: var(--tm-info) !important;
}

.tmi-autocomplete-items .tmi-autocomplete-suggestion:hover,
.tmi-autocomplete-items .tmi-autocomplete-suggestion.tmi-autocomplete-active {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
}

.tmi-autocomplete-suggestion {
    border-radius: 0 !important;
    background-color: var(--tm-cream) !important;
    color: var(--tm-primary) !important;
}

.tmi-autocomplete-suggestion:first-child {
    border-top-left-radius: var(--tm-border-radius) !important;
    border-top-right-radius: var(--tm-border-radius) !important;
}

.tmi-autocomplete-suggestion:last-child {
    border-bottom-left-radius: var(--tm-border-radius);
    border-bottom-right-radius: var(--tm-border-radius);
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
    border-color: var(--tm-info) !important;
}

.tmi-modal-level-btn.tmi-modal-level-btn-active {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
    border-color: var(--tm-info) !important;
    border-width: 1px !important;
}
.tmi-modal-level-btn.tmi-modal-level-btn-active .tmi-level-badge {
    color: var(--tm-cream) !important;
    font-size: var(--tm-btn-font-size) !important;
}

.tmi-level-badge{
    font-size: var(--tm-btn-font-size) !important;
    font-weight: var(--tm-btn-font-weight) !important;
}

.tmi-modal-level-btn:hover {
    background: var(--tm-info) !important;
    color: var(--tm-cream) !important;
}
.tmi-modal-level-btn:hover .tmi-level-badge {
    color: var(--tm-cream) !important;
}