/* Carrusel tipo Mil Anuncios - fotos casas de acogida */
.foster-carousel { position: relative; width: 100%; max-width: 300px; min-height: 180px; aspect-ratio: 4/3; background: #eee; border-radius: 8px; overflow: hidden; }
.foster-carousel-inner { width: 100%; height: 100%; position: relative; }
.foster-carousel-slide { display: none; position: absolute; top:0; left:0; width: 100%; height: 100%; }
.foster-carousel-slide.active { display: flex; align-items: center; justify-content: center; }
.foster-carousel-slide img { max-width: 100%; max-height: 100%; object-fit: contain; }
.foster-carousel-placeholder { align-items: center; justify-content: center; color: #666; font-size: 15px; background: #e0e0e0; }
.foster-carousel-placeholder span { padding: 10px; }
.foster-carousel-btn { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.5); color: white; border: none; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; font-size: 18px; line-height: 1; z-index: 2; }
.foster-carousel-btn:hover { background: rgba(0,0,0,0.7); }
.foster-carousel-prev { left: 8px; }
.foster-carousel-next { right: 8px; }
.foster-carousel-dots { position: absolute; bottom: 8px; left: 0; right: 0; text-align: center; z-index: 2; }
.foster-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.5); margin: 0 3px; cursor: pointer; transition: background 0.2s; }
.foster-dot.active { background: white; }
.foster-dot:hover { background: rgba(255,255,255,0.8); }