/* =========================================================
   DC Country List — only what Bootstrap 5 cannot do
   ========================================================= */

/* Tag pill */
.dc-cl-tag {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    /* background: #eff6ff; */
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    padding: .5rem 1rem;
    cursor: default;
    user-select: none;
    transition: background .12s ease, border-color .12s ease;
}
.dc-cl-tag:hover {
    background: #dbeafe;
    border-color: #93c5fd;
}
a.dc-cl-tag {
    color: inherit;
    cursor: pointer;
}
a.dc-cl-tag:hover {
    color: #1d4ed8;
}
.dc-cl-tag-icon {
    width: 13px;
    height: 13px;
}

/* Flush left border on input-group so focus ring looks clean */
.dc-cl-search:focus { box-shadow: none; }
.dc-cl-search:focus ~ .input-group-text,
.input-group:focus-within .input-group-text {
    border-color: #86b7fe;
}
.input-group:focus-within .dc-cl-search {
    border-color: #86b7fe;
    box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}