/*
Theme Name: Biblioteca FISAC
Theme URI: https://tudominio.com
Author: FISAC
Author URI: https://tudominio.com
Description: Un tema personalizado basado en HTML, CSS y JavaScript.
Version: 1.0
*/

/*.books-wrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	align-content: flex-start;
	gap: 25px;
}*/

.books-wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 25px;
	justify-content: center; /* Centra el grid general dentro del contenedor */
	max-width: 1000px; /* O el ancho máximo que uses */
	margin: 0 auto;
}


.book-card {
	background-color: #FFF;
	width: 220px;
	height: 320px;
	margin: 10px auto 10px auto;
	position: relative;
	overflow: hidden;
}

.book-image {
	background-color: cyan;
    height: 100%;
    margin-bottom: 0;
    position: absolute;
    width: 100%;
}

.wrapper-info {
    height: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: self-start;
    align-content: baseline;
    aspect-ratio: 1 / 1;
}

.book-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.book-info {
	position: relative;
	z-index: 1;
	/*background: linear-gradient(180deg,#FAFAFA, #C0C0C0 );*/
	background: linear-gradient(130deg,  #feccb1 0%,#f17432 50%,#f95005 51%,#fb955e 100%);
	border-radius: 5px 5px 0px 0px;
	height: 100%;
	bottom: -85%;
	transition: all 0.5s ease-in-out;
	padding: 0px 15px;
	/*box-shadow: inset 0 1px 15px 0 rgba(128,128,128,0.3), 0px 5px 25px 5px rgba(127, 127, 127, 0.5) ;*/
}

.book-title {
	font-size: 0.8rem;
	padding-top: 10px !important;
	border-bottom: 2px solid rgba(255, 255, 255, 0.3);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.book-info, .book-info a {
	font-size: 0.8rem;
	/*padding: 0px 25px;*/
}

.book-info a {
	color: #FFF !important;
	font-weight: bold;
	text-decoration: none;
}

.book-info a {
	/*bottom: 25px;*/
    /*position: absolute;*/
    display: block;
}

.book-card:hover .book-info {
	bottom: 0px;
}








/* Contenedor opcional para centrar */
.wpcf7 {
  max-width: 480px;
  margin: 60px auto;
  padding: 30px 25px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.wpcf7 label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
  color: #222;
  font-size: 15px;
}

.wpcf7 input.wpcf7-form-control.wpcf7-text,
.wpcf7 input.wpcf7-form-control.wpcf7-email,
.wpcf7 textarea.wpcf7-form-control.wpcf7-textarea {
  width: 100%;
  padding: 12px 14px;
  margin-bottom: 18px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-sizing: border-box;
  transition: border-color 0.3s ease;
  resize: vertical;
}

.wpcf7 input.wpcf7-form-control.wpcf7-text:focus,
.wpcf7 input.wpcf7-form-control.wpcf7-email:focus,
.wpcf7 textarea.wpcf7-form-control.wpcf7-textarea:focus {
  border-color: #f95005;
  outline: none;
}

.wpcf7 input.wpcf7-submit {
  width: 100%;
  background-color: #f95005;
  color: #fff;
  font-weight: 700;
  font-size: 17px;
  padding: 14px;
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.wpcf7 input.wpcf7-submit:hover {
  background-color: #f95005;
}








.um a.um-button, .um a.um-button.um-disabled:active, .um a.um-button.um-disabled:focus, .um a.um-button.um-disabled:hover, .um input[type=submit].um-button, .um input[type=submit].um-button:focus {
    background: #f95005 !important;
}

.um .um-button.um-alt, .um input[type=submit].um-button.um-alt {
	color: #FFF !important;
}








.book-search-form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 30px;
  gap: 10px;
}

.book-search-form input[type="text"] {
  padding: 10px 15px;
  font-size: 1rem;
  border: 1px solid #ccc;
  border-radius: 30px;
  width: 100%;
  max-width: 400px;
  transition: border-color 0.3s, box-shadow 0.3s;
}

.book-search-form input[type="text"]:focus {
  border-color: #f17432;
  box-shadow: 0 0 5px rgba(241, 116, 50, 0.5);
  outline: none;
}

.book-search-form button {
  padding: 10px 20px;
  background-color: #f17432;
  color: #fff;
  border: none;
  border-radius: 30px;
  cursor: pointer;
  font-size: 1rem;
  transition: background-color 0.3s;
}

.book-search-form button:hover {
  background-color: #d95c1a;
}


@media (max-width: 480px) {
  .book-search-form {
    flex-direction: column;
    align-items: stretch;
  }

  .book-search-form input[type="text"],
  .book-search-form button {
    width: 100%;
  }
}