/* Buscador Agnelli v1.4 — Paleta Ancestros Italianos */

#ba-app {
  --ai-verde-oscuro:    #1e4d2b;
  --ai-verde-medio:     #4a7c3a;
  --ai-rojo:            #c8102e;
  --ai-rojo-oscuro:     #a00d24;
  --ai-crema:           #faf7f0;
  --ai-blanco:          #ffffff;
  --ai-hover-tabla:     #fff7e6;
  --ai-borde:           #d9d2c2;
  --ai-borde-detalle:   #e8e2d2;
  --ai-texto:           #2b2b2b;
  --ai-texto-label:     #666666;
  --ai-texto-claro:     #999999;
  --ai-font:            Arial, Helvetica, sans-serif;

  font-family: var(--ai-font);
  font-size: 16px;
  color: var(--ai-texto);
  max-width: 100%;
  line-height: 1.55;
}

.ba-panel {
  background: var(--ai-crema);
  border: 1px solid var(--ai-borde);
  border-left: 4px solid var(--ai-verde-oscuro);
  border-radius: 6px;
  padding: 1.1rem 1.25rem;
  margin-bottom: 1rem;
}
.ba-search-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}
.ba-field { flex: 1 1 180px; min-width: 140px; }
.ba-field--sm { flex: 0 1 130px; }
.ba-field label {
  display: block;
  font-size: 13px;
  color: var(--ai-verde-oscuro);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 4px;
}

#ba-app input[type="text"],
#ba-app select {
  width: 100%;
  height: 38px;
  padding: 0 10px;
  border: 1px solid var(--ai-borde);
  border-radius: 4px;
  background: var(--ai-blanco);
  color: var(--ai-texto);
  font-family: var(--ai-font);
  font-size: 15px;
  outline: none;
  box-shadow: none;
  transition: border-color .15s;
  margin: 0;
}
#ba-app input[type="text"]:focus,
#ba-app select:focus {
  border-color: var(--ai-verde-medio);
  box-shadow: 0 0 0 2px rgba(74,124,58,0.2);
}

.ba-actions { display: flex; gap: 6px; align-items: flex-end; }

#ba-btn-search {
  height: 38px;
  padding: 0 20px;
  background: var(--ai-rojo);
  color: var(--ai-blanco);
  border: 1px solid var(--ai-rojo-oscuro);
  border-radius: 4px;
  font-family: var(--ai-font);
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s;
  white-space: nowrap;
}
#ba-btn-search:hover   { background: var(--ai-rojo-oscuro); }
#ba-btn-search:disabled { opacity: .55; cursor: default; }

#ba-btn-clear {
  height: 38px;
  padding: 0 12px;
  background: none;
  border: 1px solid var(--ai-borde);
  border-radius: 4px;
  color: var(--ai-texto-label);
  font-family: var(--ai-font);
  font-size: 15px;
  cursor: pointer;
}
#ba-btn-clear:hover { background: var(--ai-borde-detalle); }

.ba-loading-bar {
  height: 3px;
  background: var(--ai-rojo);
  border-radius: 2px;
  width: 0;
  transition: width .4s;
  margin-bottom: .75rem;
}

.ba-results-header {
  min-height: 22px;
  margin-bottom: 8px;
  font-size: 15px;
  color: var(--ai-texto-label);
}
.ba-results-header strong { color: var(--ai-verde-oscuro); font-weight: 700; }

.ba-table-wrap {
  background: var(--ai-blanco);
  border: 1px solid var(--ai-borde);
  border-radius: 6px;
  overflow: hidden;
}
.ba-overflow { overflow-x: auto; }

#ba-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--ai-font);
  font-size: 15px;
}
#ba-table th {
  background: var(--ai-verde-oscuro);
  color: var(--ai-blanco);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 9px 10px;
  text-align: left;
  border-bottom: 1px solid var(--ai-borde);
  white-space: nowrap;
}
#ba-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--ai-borde-detalle);
  color: var(--ai-texto);
  vertical-align: middle;
}
#ba-table tr:last-child td { border-bottom: none; }
#ba-table tbody tr:hover td { background: var(--ai-hover-tabla); }

.ba-ship-link {
  color: var(--ai-rojo);
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  background: none;
  border: none;
  padding: 0;
  font-family: var(--ai-font);
  font-size: 15px;
  transition: color .15s;
}
.ba-ship-link:hover { color: var(--ai-rojo-oscuro); text-decoration: underline; }

.ba-badge-year {
  display: inline-block;
  background: var(--ai-crema);
  color: var(--ai-verde-oscuro);
  border: 1px solid var(--ai-borde);
  font-size: 12px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
}

.ba-null { color: var(--ai-texto-claro); font-style: italic; }
.ba-state {
  text-align: center;
  padding: 2.5rem 1rem;
  color: var(--ai-texto-label);
  font-size: 15px;
}
.ba-anchor { display: block; font-size: 28px; margin-bottom: 6px; }

.ba-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: .9rem;
  justify-content: center;
}
.ba-page-btn {
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--ai-borde);
  border-radius: 4px;
  background: var(--ai-blanco);
  color: var(--ai-texto);
  font-family: var(--ai-font);
  font-size: 14px;
  cursor: pointer;
  transition: background .12s;
}
.ba-page-btn:hover { background: var(--ai-crema); }
.ba-page-btn.active {
  background: var(--ai-rojo);
  color: var(--ai-blanco);
  border-color: var(--ai-rojo-oscuro);
  font-weight: 700;
}
.ba-page-btn:disabled { opacity: .4; cursor: default; }
.ba-ellipsis { color: var(--ai-texto-claro); line-height: 34px; padding: 0 3px; }

@media (max-width: 600px) {
  #ba-app { font-size: 15px; }
  #ba-btn-search { width: 100%; }
  .ba-field, .ba-field--sm { flex: 1 1 100%; }
}