/* Autocompletar: sugerencias con el estilo del sistema (reemplaza el <datalist> nativo) */
.ac-panel{
    position:absolute;
    z-index:2147483647;
    background:#fff;
    border:1px solid var(--rgba-primary-3, rgba(235,129,83,.3));
    border-radius:.625rem;
    box-shadow:0 .5rem 1.5rem rgba(0,0,0,.12);
    padding:.35rem;
    max-height:16rem;
    overflow-y:auto;
    display:none;
}
.ac-panel.is-open{ display:block; }

.ac-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    padding:.5rem .65rem;
    border-radius:.45rem;
    cursor:pointer;
    font-size:.8rem;
    line-height:1.25;
    color:#3e4954;
}
.ac-item + .ac-item{ margin-top:.1rem; }
.ac-item:hover,
.ac-item.is-active{
    background:var(--primary-light, #fbe5dc);
    color:var(--primary-dark, #943911);
}
.ac-item .ac-label{ font-weight:500; }
.ac-item .ac-label mark{
    background:transparent;
    color:var(--primary, #eb8153);
    font-weight:700;
    padding:0;
}
.ac-item .ac-hint{
    flex-shrink:0;
    font-size:.72rem;
    color:#8a94a0;
    white-space:nowrap;
}
.ac-item.is-active .ac-hint{ color:var(--primary-hover, #e66025); }

.ac-empty{
    padding:.6rem .65rem;
    font-size:.78rem;
    color:#8a94a0;
}

/* señal visual de que un input tiene selección válida */
.ac-input.ac-chosen{
    border-color:var(--primary, #eb8153);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23eb8153' viewBox='0 0 16 16'%3E%3Cpath d='M13.485 1.929a1 1 0 0 1 0 1.414l-7.07 7.071a1 1 0 0 1-1.415 0L1.515 6.929A1 1 0 0 1 2.929 5.515l2.343 2.343 6.364-6.364a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right .5rem center;
    padding-right:1.75rem;
}