.cfaps-wrapper{ position:relative; max-width:100%; }
.cfaps-form{ position:relative; display:flex; align-items:center; }
.cfaps-input{
width:100%; padding:12px 44px 12px 16px;
border:1px solid #ddd; border-radius:28px;
outline:none; transition:box-shadow .2s, border-color .2s;
}
.cfaps-input:focus{ border-color:#bbb; box-shadow:0 0 0 3px rgba(0,0,0,.06); }
.cfaps-btn{
position:absolute; right:8px; top:50%; transform:translateY(-50%);
border:none; background:#333; color:#fff; width:36px; height:36px;
border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.cfaps-clear{
position:absolute; right:52px; top:50%; transform:translateY(-50%);
border:none; background:transparent; font-size:22px; color:#678; cursor:pointer; display:none;
}
.cfaps-input:not(:placeholder-shown) ~ .cfaps-clear{ display:block; }
.cfaps-results{
position:absolute; left:0; right:0; top:100%; margin-top:8px;
background:#fff; border:1px solid #eee; border-radius:14px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
z-index:9999; padding:6px; display:none;
max-height:60vh; overflow:auto;
}
.cfaps-results.open{ display:block; }
.cfaps-status{ padding:14px; font-size:14px; color:#666; }
.cfaps-list{ list-style-type:none; margin:0; padding:0; }
.cfaps-item{ border-radius:10px; }
.cfaps-item + .cfaps-item{ margin-top:6px; }
.cfaps-link{ display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:12px;
padding:10px 12px; border-radius:10px; text-decoration:none; color:inherit;
}
.cfaps-link:hover{ background:#f6f7f8; }
.cfaps-thumb{ width:48px; height:48px; border-radius:8px; overflow:hidden; background:#f1f1f1; display:flex; align-items:center; justify-content:center; }
.cfaps-thumb img{ max-width:100%; max-height:100%; display:block; } .cfaps-list ul {
list-style-type: none!important;
padding-left: 0!important;
margin-left: 0!important;
}
.cfaps-results li {
align-items: center!important;
gap: 10px!important;
padding: 6px 0!important;
border-bottom: 1px solid #eee!important;
}
.cfaps-results li:last-child {
border-bottom: none!important;
}
.cfaps-link{
display:grid; grid-template-columns:48px 1fr auto; align-items:flex-start; gap:12px;
padding:10px 12px; border-radius:10px; text-decoration:none; color:inherit;
}
.cfaps-text{ display:flex; flex-direction:column; gap:2px; }
.cfaps-title{
font-family:'Raleway', sans-serif;
font-weight:700;
font-size:14px;
line-height:1.3;
color:#222;
}
.cfaps-cats{
font-size:12px;
color:#777;
font-style:italic;
}
.cfaps-price{
font-size:14px;
font-weight:500;
white-space:nowrap;
color:#333;
} @media (max-width: 480px) {
.cfaps-title {
font-size: 12px; line-height: 1.2;
}
.cfaps-cats {
font-size: 11px;
}
.cfaps-price {
font-size: 12px;
}
}