
.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 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 10px;
    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-add-btn {
    background: #27ae60;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 16px;
    transition: background 0.2s;
}

.cfaps-add-btn:hover {
    background: #2ecc71;
    color: #fff;
}

/* Remove a bolinha da lista de resultados */
.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;
}

/* Container principal dos resultados */
.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,0.08);
    z-index: 9999;
    padding: 10px;
    max-height: 60vh;
    overflow: auto;
}

.cfaps-results.open { display: block; }

/* Lista de itens */
.cfaps-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Estrutura da Linha (Flexbox) */
.cfaps-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 10px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    gap: 15px !important;
}

.cfaps-item:last-child {
    border-bottom: none !important;
}

/* Lado Esquerdo: Imagem + Textos */
.cfaps-link-wrapper {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1; /* Ocupa o espaço disponível */
    text-decoration: none;
    color: inherit;
}

.cfaps-thumb {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 6px;
    overflow: hidden;
    background: #f9f9f9;
    border: 1px solid #eee;
}

.cfaps-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Título e Categoria */
.cfaps-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cfaps-title {
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #222;
    line-height: 1.2;
}

.cfaps-cats {
    font-size: 12px;
    color: #999;
    font-style: italic;
}

/* Lado Direito: Botão + Preço */
.cfaps-action {
    display: flex;
    align-items: center;
    gap: 20px;
}

/* Botão Azul do Print */
.cfaps-add-btn {
    background-color: #1e73be; /* Azul do print */
    color: #fff !important;
    padding: 8px 20px;
    border-radius: 25px; /* Bem arredondado */
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.2s;
}

.cfaps-add-btn:hover {
    background-color: #165a94;
}

/* Preço */
.cfaps-price {
    font-size: 18px;
    font-weight: 700;
    color: #333;
    min-width: 90px;
    text-align: right;
    white-space: nowrap;
}

.cfaps-added-msg {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #27ae60;
    color: #fff;
    padding: 10px 16px;
    border-radius: 6px;
    font-size: 14px;
    z-index: 99999;
    display: none;
}

/* Ajustes para Mobile */
@media (max-width: 600px) {
    .cfaps-item {
        flex-wrap: wrap; /* Quebra linha se não couber */
    }
    .cfaps-action {
        width: 100%;
        justify-content: flex-end;
        margin-top: 5px;
        gap: 10px;
    }
    .cfaps-price {
        font-size: 16px;
    }
}

/* Ajustes responsivos para títulos longos no dropdown */
@media (max-width: 480px) {
  .cfaps-title {
    font-size: 12px;   /* menor que os 14px atuais */
    line-height: 1.2;
  }

  .cfaps-cats {
    font-size: 11px;
  }

  .cfaps-price {
    font-size: 12px;
  }
}


