/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* style.css sets a global "h5 { line-height: 0; }". That's harmless for the
   short single-line captions h5 is normally used for, but it makes any h5
   that wraps to two or more lines (e.g. a long author/editor credit on a
   book page) render with overlapping text. Restore a normal line-height
   just for the book detail area where longer credits appear. */
.entry-content h5 { line-height: 1.4; }

/* Book detail pages used a non-standard "<h7>" tag for the title, styled
   with its own color/weight elsewhere in style.css. <h7> isn't a real HTML
   element, so it was replaced with a valid <h4 class="book-title">; this
   keeps the original look (and, unlike the old rule, a line-height that
   won't collapse a wrapped multi-line title). */
.entry-content .book-title {
	color: #546e8c;
	font-weight: 700;
	line-height: 1.3;
}

/* Top bar tagline: same "<h7>" situation as the book title above — restores
   the original highlighted look (color/weight/size) with valid markup. */
.topbar-tagline {
	color: #546e8c;
	font-weight: 700;
	font-size: 18px;
}

/* Book detail pages: the author/editor credit line is set in italics. */
.entry-content .book-author {
	font-style: italic;
}

/* Reorder button on each collection's cover gallery, plus its "Cambiar
   orden" label. Same look/behaviour as the theme's own ".portfolio-shuffle"
   control, in the site's corporate blue (the same #478fb8 used by the
   default .button style, e.g. "Volver"). */
.posts-reorder-wrap {
	display: flex;
	align-items: center;
	gap: 10px;
	float: right;
	margin-bottom: 10px;
}

/* Same size/type as the "Inicio" breadcrumb link just above it. */
.posts-reorder-label {
	font-family: Litos, sans-serif;
	font-size: 14.4px;
	font-weight: 600;
	color: #555;
}

.posts-reorder {
	width: 41px;
	height: 41px;
	border: 1px solid #478fb8;
	border-radius: 4px;
	font-size: 16px;
	line-height: 39px;
	text-align: center;
	color: #478fb8;
	cursor: pointer;
	transition: all .2s linear;
}

/* Matches the reference site's spacing: the grid's own top padding is
   reduced from the theme's default 80px to 10px, so the button sits the
   same distance from the page title above as it does from the covers
   below (the 10px above comes from this; the 10px below comes from the
   button's own margin-bottom set above). Only the top padding is touched —
   the bottom padding is left as-is, since that space is unrelated to the
   button and keeps the existing gap before the footer. */
.gallery-content-wrap {
	padding-top: 10px !important;
}

.posts-reorder:hover,
.posts-reorder:focus {
	background-color: #478fb8;
	color: #FFF;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

.posts-reorder i {
	transition: transform .3s ease;
}

.posts-reorder.is-reversed i {
	transform: rotate(180deg);
}

/* Cover galleries (the collection pages and the homepage grid): a subtle
   lift + shadow on hover, since the covers currently give no feedback at
   all when you mouse over them. .grid-inner clips flush against the cover
   on every side except the bottom (room for the title below), so the glow
   only shows there. */
.entry-image img {
	transition: transform .25s ease, box-shadow .25s ease;
}

.entry:hover .entry-image img {
	transform: translateY(-6px);
	box-shadow: 0 0 8px rgba(71,143,184,.6);
}

/* Book detail pages: the field labels in "Datos del libro" (Publicación,
   ISBN, Precio de venta...) get just enough weight to read as labels next
   to their values, short of full bold. */
.field-label {
	font-weight: 600;
}

/* The "Datos del libro:" / "Reseña:" section headings go fully bold, so
   they stay the clear top of the hierarchy above the semi-bold field
   labels they introduce. */
.section-label {
	font-weight: 700;
}

/* Mega-menu ("Colecciones") sub-items: same full-width hover band as
   style.css's own rule (padding-left shift, text color change), just with
   the corporate blue instead of its plain gray. */
.sub-menu-container .menu-item:hover > .menu-link {
	background-color: rgba(71,143,184,.1);
}

/* Footer partner logos (Rizoma Freireano / Institut Paulo Freire), to the
   right of the copyright text. Shown at their natural size, with their own
   PNG transparency, against the footer's light pattern background
   (matches the top bar — see the "page-title-pattern" swap on <footer>). */
.footer-partner-logos {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

/* The footer's default link color (the site's light corporate blue,
   #7ca9c3) was tuned for the old dark footer and fails contrast (1.85:1)
   against the light pattern background now used here. A darker shade of
   the same blue keeps the corporate color while passing WCAG AA (4.72:1). */
#footer a {
	color: #316480;
}

#footer a:hover {
	color: #1d3c4d;
}

/* Separator between "Información legal" and "Protección de datos". */
.footer-dot {
	color: #478fb8;
	font-weight: 700;
}

/* Homepage: "Colecciones" section label, in the same pattern-background
   bar used for each collection's own title (e.g. "Aprendizajes" on
   aprendizajes.html) and for the topbar tagline above it. It's an h2
   (not h1, styled to match #page-title.page-title-mini h1) since the
   homepage already has its own hidden h1 for SEO. */
#page-title.page-title-mini h2 {
	margin: 0;
	padding: 0;
	line-height: 1;
	font-weight: 600;
	font-size: 16px;
	color: #546e8c;
	text-transform: uppercase;
	letter-spacing: 1px;
}

/* Homepage only: match the topbar tagline bar's height exactly. */
#page-title.page-title-mini.page-title-center {
	padding: 13.5px 0;
}