/*
Theme Name: Pinbin Biblioteca
Theme URI: https://biblioteca.acropolis.org/
Description: Tema hijo de Pinbin 2.x para la Biblioteca de Nueva Acropolis.
Author: Nueva Acropolis
Template: pinbin
Version: 2.0.2.9
Text Domain: pinbin-biblioteca
*/

/* El tema padre carga su CSS principal. Este archivo contiene solo ajustes propios. */

.pinbin-card__author,
.pinbin-single__author {
	margin: 0.15rem 0 0.5rem;
	font-size: 0.9em;
}

.pinbin-card__media {
	position: relative;
}

.pinbin-new-badge {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	z-index: 2;
	padding: 0.3rem 0.55rem;
	border-radius: 999px;
	background: rgba(255,255,255,0.92);
	color: #274c2c;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.pinbin-biblioteca-meta {
	margin-top: 2rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(127,127,127,0.25);
}

.pinbin-biblioteca-meta h4 {
	margin-bottom: 0.35rem;
}

.pinbin-biblioteca-index {
	max-width: 800px;
}

/* --------------------------------------------------------------------------
   Lectura de articulos: tipografia mas contenida
   -------------------------------------------------------------------------- */
.site-main--single .entry-title {
	font-size: clamp(1.8rem, 1.55rem + 1.2vw, 2.65rem);
}

.site-main--single .entry-content {
	font-size: 1rem;
	line-height: 1.72;
}

.site-main--single .entry-content h2 {
	font-size: clamp(1.55rem, 1.4rem + 0.7vw, 2.1rem);
}

.site-main--single .entry-content h3 {
	font-size: clamp(1.25rem, 1.15rem + 0.4vw, 1.55rem);
}

/* --------------------------------------------------------------------------
   Boton progresivo \"Cargar mas articulos\"
   -------------------------------------------------------------------------- */
.pinbin-load-more-wrap {
	display: flex;
	justify-content: center;
	margin-top: var(--pinbin-section);
}

.pinbin-load-more {
	appearance: none;
	border: 0;
	border-radius: 999px;
	padding: 0.75rem 1.5rem;
	background: var(--pinbin-ink);
	color: var(--pinbin-canvas);
	font: inherit;
	font-size: var(--pinbin-text-sm);
	font-weight: 600;
	cursor: pointer;
	transition: transform var(--pinbin-duration) var(--pinbin-ease),
	            opacity var(--pinbin-duration) var(--pinbin-ease);
}

.pinbin-load-more:hover:not(:disabled),
.pinbin-load-more:focus-visible:not(:disabled) {
	transform: translateY(-1px);
}

.pinbin-load-more:disabled {
	opacity: 0.65;
	cursor: wait;
}

@media (max-width: 600px) {
	.site-main--single .pinbin-single__media {
		width: calc(100% - 2rem);
		margin: 0 auto 1.5rem;
	}
}


/* --------------------------------------------------------------------------
   YARPP - miniaturas de "Tambien te puede interesar"
   Caja fija 120x120 sin deformacion ni solapamiento.
   -------------------------------------------------------------------------- */
html body .yarpp-related .yarpp-thumbnail,
html body .yarpp-thumbnail {
	width: 130px !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

html body .yarpp-related .yarpp-thumbnail > img,
html body .yarpp-thumbnail > img {
	width: 120px !important;
	height: 120px !important;
	max-width: 120px !important;
	margin: 5px !important;
	display: block !important;
	object-fit: cover !important;
	object-position: center !important;
}

/* =========================================================
   Fondo clasico Biblioteca - patron circleandstar
   ========================================================= */
body {
    background-image: url("https://biblioteca.acropolis.org/wp-content/uploads/2014/08/circleandstar.jpg") !important;
    background-repeat: repeat !important;
    background-position: top left !important;
    background-attachment: fixed !important;
}

/* YARPP: mostrar el titulo completo de los articulos relacionados */
.yarpp-related .yarpp-thumbnail-title,
.yarpp-thumbnails-horizontal .yarpp-thumbnail-title {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    white-space: normal !important;
}


/* --------------------------------------------------------------------------
   YARPP - titulos completos y algo mas pequenos
   El propio contenedor .yarpp-thumbnail puede limitar la altura y recortar
   el texto, por eso se libera tambien su overflow y su altura.
   -------------------------------------------------------------------------- */
html body .yarpp-related .yarpp-thumbnail,
html body .yarpp-thumbnails-horizontal .yarpp-thumbnail {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    vertical-align: top !important;
}

html body .yarpp-related .yarpp-thumbnail-title,
html body .yarpp-thumbnails-horizontal .yarpp-thumbnail-title {
    display: block !important;
    width: 120px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    white-space: normal !important;
    text-overflow: clip !important;
    font-size: 0.78em !important;
    line-height: 1.25 !important;
    margin: 7px 5px 5px !important;
}