.ts-wrap {
position: relative;
width: 66.67%;
max-width: 760px;
margin-left: auto;
margin-right: auto;
font-family: inherit;
} .ts-pill,
div.ts-pill,
.ts-wrap > .ts-pill {
display: flex !important;
align-items: center !important;
gap: 10px !important;
padding: 0 12px 0 16px !important;
height: 64px !important;
background: #dde5f0 !important;
border: 0 !important;
outline: none !important;
-webkit-tap-highlight-color: transparent;
border-radius: 999px !important;
transition: background .18s ease;
cursor: text !important;
box-shadow: none !important;
color: inherit !important;
}
.ts-wrap.is-open .ts-pill,
.ts-wrap.is-open div.ts-pill {
background: #203c85 !important;
}
.ts-wrap.is-open .ts-pill-icon {
color: #fff !important;
}
.ts-wrap.is-open .ts-input,
.ts-wrap.is-open input.ts-input {
color: #fff !important;
}
.ts-wrap.is-open .ts-input::placeholder {
color: rgba(255,255,255,.55) !important;
}
.ts-pill-icon {
width: 22px;
height: 22px;
color: #203c85;
flex-shrink: 0;
}
.ts-input,
input.ts-input {
flex: 1 !important;
border: 0 !important;
outline: none !important;
box-shadow: none !important;
background: transparent !important;
font-size: 18px !important;
font-weight: 500 !important;
color: #203c85 !important;
font-weight: 700 !important;
min-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
border-radius: 0 !important;
height: auto !important;
width: 100% !important;
}
.ts-input::placeholder { color: #203c85 !important; font-weight: 400 !important; opacity: .55; }
.ts-input:placeholder-shown { font-weight: 400 !important; }
.ts-clear {
flex-shrink: 0;
width: 28px;
height: 28px;
border: 0;
background: #f0f3fa;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: #7a82a0;
transition: background .14s, color .14s;
}
.ts-clear:hover { background: #dde5ff; color: #203c85; }
.ts-clear svg { width: 12px; height: 12px; } .ts-dropdown[hidden] { display: none !important; } .ts-dropdown {
position: absolute;
top: calc(100% + 6px);
left: 0;
right: 0;
background: #fff;
border: 0;
border-radius: 20px;
padding: 8px 0 10px;
box-shadow: 0 20px 60px rgba(14,22,58,.12), 0 4px 16px rgba(14,22,58,.06);
z-index: 9999;
max-height: 420px;
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: none;
animation: ts-in .2s cubic-bezier(.22,1,.36,1);
}
.ts-dropdown::-webkit-scrollbar { display: none; }
@keyframes ts-in {
from { opacity: 0; transform: translateY(-6px) scale(.98); }
to   { opacity: 1; transform: translateY(0)    scale(1); }
} .ts-label {
font-size: 10px;
font-weight: 700;
letter-spacing: .1em;
text-transform: uppercase;
color: #a0a8c4;
padding: 8px 18px 5px;
margin: 0;
} .ts-chips {
display: flex;
flex-wrap: wrap;
gap: 6px;
padding: 2px 14px 10px;
}
.ts-chip {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 5px 13px;
background: #f0f4ff;
color: #203c85;
border-radius: 999px;
font-size: 12.5px;
font-weight: 600;
text-decoration: none;
transition: background .14s;
white-space: nowrap;
}
.ts-chip:hover { background: #dde5ff; }
.ts-chip__n {
font-size: 10.5px;
font-weight: 500;
opacity: .55;
} .ts-divider {
height: 1px;
background: #f0f3fa;
margin: 6px 0;
} .ts-list { list-style: none; margin: 0; padding: 0; }
.ts-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 9px 18px;
cursor: pointer;
text-decoration: none;
color: inherit;
transition: background .12s;
border: 0;
width: 100%;
background: transparent;
text-align: left;
}
.ts-item:hover,
.ts-item[aria-selected="true"] {
background: #f5f7ff;
}
.ts-item__name {
font-size: 14px;
font-weight: 500;
color: #16224d;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ts-item__name mark {
background: transparent;
color: #203c85;
font-weight: 700;
}
.ts-item__badge {
flex-shrink: 0;
font-size: 10.5px;
font-weight: 600;
color: #a0a8c4;
background: #f0f4ff;
border-radius: 999px;
padding: 2px 9px;
white-space: nowrap;
}
.ts-item__icon {
flex-shrink: 0;
width: 14px;
height: 14px;
color: #c0c8e0;
} .ts-empty {
text-align: center;
padding: 22px 18px;
color: #a0a8c4;
font-size: 13.5px;
margin: 0;
} @media (max-width: 640px) {
.ts-wrap { width: 100% !important; max-width: 100% !important; }
.ts-pill { height: 56px !important; padding: 0 14px 0 16px !important; }
.ts-input { font-size: 14px; }
.ts-dropdown { border-radius: 16px; max-height: 360px; }
.ts-chip { font-size: 12px; padding: 4px 11px; }
.ts-item { padding: 10px 14px; }
.ts-item__name { font-size: 13.5px; }
}