/*
Theme Name: Blocksy Child
Template: blocksy
*/

.biblioteca-top{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:32px;
  align-items:start;
  margin-bottom:32px;
}

.biblioteca-top-right{
  min-width:0;
}

.destacados-box{
  background:#fff;
  border:1px solid #ececec;
  border-radius:18px;
  padding:18px;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  overflow:hidden;
}

.destacados-head{
  font-size:18px;
  font-weight:700;
  margin-bottom:14px;
}

.destacados-viewport{
  overflow:hidden;
  width:100%;
}

.destacados-track{
  display:flex;
  gap:16px;
  width:max-content;
  animation: destacados-scroll 17s linear infinite;
}

.destacados-box:hover .destacados-track{
  animation-play-state: paused;
}

.destacado-card{
  display:block;
  width:150px;
  text-decoration:none;
  color:#111;
  flex:0 0 auto;
}

.destacado-cover{
  width:100%;
  aspect-ratio:2/3;
  background:#f2f2f2;
  border-radius:12px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

.destacado-title{
  margin-top:10px;
  font-size:14px;
  font-weight:600;
  line-height:1.3;
}

@keyframes destacados-scroll{
  0% { transform: translateX(0); }
  100% { transform: translateX(-45%); }
}

@media (max-width: 1024px){
  .biblioteca-top{
    grid-template-columns:1fr;
  }

  .biblioteca-top-right{
    display:none;
  }
}

header,
.site-header,
.ct-header {
  padding-top: env(safe-area-inset-top);
}

body {
  padding-top: env(safe-area-inset-top);
}

@supports (padding-top: env(safe-area-inset-top)) {
  .ct-header {
    padding-top: calc(env(safe-area-inset-top) + 10px);
  }
}

@supports (padding-bottom: env(safe-area-inset-bottom)) {
  body {
    padding-bottom: calc(env(safe-area-inset-bottom) + 40px);
  }
}

.single-libro {
  padding-bottom: 80px;
}

/* Paginación más cómoda */
.page-numbers {
  display: inline-block;
  margin: 6px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #f4f4f4;
  color: #111;
  text-decoration: none;
  font-size: 15px;
}

/* Hover escritorio */
.page-numbers:hover {
  background: #111;
  color: #fff;
}

/* Página activa */
.page-numbers.current {
  background: #111;
  color: #fff;
}

/* Flechas */
.page-numbers.prev,
.page-numbers.next {
  font-weight: bold;
}

@media (max-width: 768px) {
  .page-numbers {
    margin: 8px;
    padding: 12px 16px;
    font-size: 16px;
  }
}

.page-numbers {
  min-width: 44px;
  text-align: center;
}

/* Language Selector */
.bhaktilib-lang-selector {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding: 10px 20px;
    max-width: 1280px;
    margin: 0 auto;
}

.bhaktilib-lang-selector button {
    background: #fff;
    border: 1px solid #d6d6d6;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #111;
}

.bhaktilib-lang-selector button:hover {
    background: #f4f4f4;
}

.bhaktilib-lang-selector button.active {
    background: #111;
    border-color: #111;
    color: #fff;
}

@media (max-width: 768px) {
    .bhaktilib-lang-selector {
        justify-content: center;
        padding: 10px;
    }
}

/* PWA Install Button Alignment */
.pwa-install-item {
    display: none !important; /* Hidden by default */
}

/* En escritorio, forzamos que herede el comportamiento de flex de Blocksy */
.pwa-install-item.is-visible {
    display: inline-flex !important;
}

/* En móvil, Blocksy suele usar bloques para el menú lateral */
@media (max-width: 992px) {
    .pwa-install-item.is-visible {
        display: block !important;
    }
}

/* iOS Install Modal */
#ios-install-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    padding-bottom: 20px;
}

#ios-install-modal.is-visible {
    opacity: 1;
    visibility: visible;
}

.ios-install-content {
    background: #fff;
    width: 94%;
    max-width: 420px;
    border-radius: 24px;
    padding: 30px;
    position: relative;
    box-shadow: 0 -5px 30px rgba(0,0,0,0.15);
    transform: translateY(100px);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-align: center;
}

#ios-install-modal.is-visible .ios-install-content {
    transform: translateY(0);
}

.ios-install-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #111;
}

.ios-install-step {
    font-size: 16px;
    margin-bottom: 15px;
    color: #444;
    line-height: 1.5;
    text-align: left;
    background: #f9f9f9;
    padding: 12px 16px;
    border-radius: 12px;
}

.ios-install-close {
    margin-top: 15px;
    padding: 12px 30px;
    background: #111;
    color: #fff;
    border-radius: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-block;
    width: 100%;
}