/* 
Theme Name:		 CineTheme
Theme URI:		 http://childtheme-generator.com/
Description:	 CineTheme is a child theme of GeneratePress, created by ChildTheme-Generator.com
Author:			 brandon
Author URI:		 http://childtheme-generator.com/
Template:		 generatepress
Version:		 1.0.0
Text Domain:	 generatepress-peliculas
*/


/*
    Add your custom styles here
*/
/* Contenedor centrado */
/* Contenedor de la cabecera */
/* Contenedor flex para logo y buscador */
/* Contenedor header con logo + buscador */
.inside-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

/* Estilo buscador en escritorio */
.header-search {
    flex: 1;
    max-width: 500px;
    margin-left: 20px;
}

.header-search .search-form {
    display: flex;
}

.header-search input.search-field {
    flex: 1;
    padding: 10px;
    font-size: 16px;
}

.header-search .search-submit {
    padding: 10px 20px;
    background: #555;
    color: white;
    border: none;
    cursor: pointer;
}

/* En móvil: buscador debajo del logo */
@media (max-width: 768px) {
    .inside-header {
        flex-direction: column;
        align-items: center;
    }

    .header-search {
        max-width: 100%;
        margin: 10px 0 0;
    }

    .header-search input.search-field {
        font-size: 14px;
    }
}
/* Contenedor de las películas en búsqueda */
.movies-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px;
}

/* Tarjeta individual de película */
.movie-card {
    background: #fff;
    border-radius: 8px;
    padding: 10px;
    text-align: center;
}

/* Imagen dentro de cada tarjeta */
.movie-card img {
    width: 200px;
    height: 300px;
    object-fit: cover;
    border-radius: 6px;
}
.movie-card h2 {
    font-size: 14px;      /* Tamaño más pequeño */
    line-height: 1.3;     /* Altura de línea más compacta */
    margin-top: 8px;      /* Espacio arriba del título */
    text-align: center;   /* Centrado */
    font-weight: normal;  /* Quitar negrita pesada si quieres */
    overflow: hidden;     /* Evita que sobresalga */
    text-overflow: ellipsis; /* Puntos suspensivos si es muy largo */
    white-space: nowrap;  /* Mantener en una sola línea */
}