/* Archivo: style.css (¡ACTUALIZADO CON FAVORITOS!) */
body { font-family: 'Roboto', sans-serif; background-color: #f4f7f6; color: #333; margin: 0; padding: 15px; }
.event-finder-container { max-width: 900px; margin: 15px auto; padding: 25px; background-color: #fff; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
header { text-align: center; margin-bottom: 25px; border-bottom: 1px solid #eee; padding-bottom: 25px; }
header h2 { font-size: 2.2em; color: #2c3e50; margin: 0 0 5px 0; }
header p { color: #7f8c8d; font-size: 1.1em; }

.filters { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 25px; }
.filter-btn { display: inline-flex; align-items: center; padding: 10px 20px; border: 1px solid #ddd; background-color: #fff; border-radius: 25px; cursor: pointer; font-size: 1em; font-weight: 500; color: #34495e; transition: all 0.25s ease; }
.filter-btn i { margin-right: 8px; color: #7f8c8d; transition: color 0.25s ease; }
.filter-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(0,0,0,0.1); border-color: #bdc3c7; }
.filter-btn.active { background-color: #3498db; color: white; border-color: #3498db; box-shadow: 0 4px 12px rgba(52, 152, 219, 0.4); }
.filter-btn.active i { color: white; }
/* Estilo especial para el botón de guardados */
.filter-btn[data-filter="guardados"].active { background-color: #27ae60; border-color: #27ae60; box-shadow: 0 4px 12px rgba(39, 174, 96, 0.4); }

#loader { text-align: center; padding: 50px; color: #95a5a6; font-size: 1.1em; }
.hidden { display: none; }
#results-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 25px; }
.event-card { position: relative; background-color: #fff; border: 1px solid #ecf0f1; border-radius: 10px; overflow: hidden; box-shadow: 0 2px 5px rgba(0,0,0,0.05); transition: all 0.3s ease; display: flex; flex-direction: column; }
.event-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.event-card img { width: 100%; height: 160px; object-fit: cover; background-color: #f8f9fa; border-bottom: 1px solid #ecf0f1; }
.event-card-content { padding: 15px 20px; flex-grow: 1; display: flex; flex-direction: column; }
.event-card-content h3 { margin: 0 0 10px 0; font-size: 1.15em; line-height: 1.4; color: #2c3e50; padding-right: 30px; } /* Espacio para el botón de guardar */
.event-card-content p { font-size: 0.9em; color: #555; line-height: 1.6; margin: 0 0 20px 0; flex-grow: 1; }
.event-card-content a { text-decoration: none; color: #3498db; font-weight: bold; align-self: flex-start; }

/* NUEVO: Estilo para el botón de guardar en cada tarjeta */
.save-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 1.4em;
    color: #bdc3c7;
    cursor: pointer;
    transition: all 0.2s ease;
}
.save-btn:hover { color: #34495e; transform: scale(1.2); }
.save-btn.saved { color: #27ae60; } /* Color cuando está guardado */

#load-more-btn { grid-column: 1 / -1; padding: 15px; margin-top: 25px; border: 2px solid #3498db; background-color: transparent; color: #3498db; border-radius: 8px; font-size: 1.1em; font-weight: 700; cursor: pointer; transition: all 0.2s; }
#load-more-btn:hover { background-color: #3498db; color: white; }