/* Container do leitor */
.reader{
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 12px;                 /* respiro lateral no mobile */
  box-sizing: border-box;
}
.reader .title{
  font-size:2rem; font-weight:800; margin:12px 0 6px;
  display:flex; justify-content:space-between; align-items:flex-end;
}
.reader .date{ color:#c9ced6; font-size:.95rem; }

/* Light Novel */
.reader .content{
  max-width: 820px; margin: 14px auto;
  line-height: 1.8;
}
.reader .content img{
  max-width:100%;
  height:auto;
  border-radius:0;                 /* sem cantos arredondados */
  display:block;
  margin:10px auto;
  box-sizing: border-box;
  pointer-events: none;
}

.logo-link { display: inline-flex; align-items: center; padding: 14px 16px 8px; }
.logo { width: 100px; height: auto; display: block; pointer-events: none;}

/* ===== Páginas de mangá (virtualizadas) ===== */
.reader .pages{
  display:flex;
  flex-direction:column;
  gap:0px;                        /* gap menor por padrão */
  align-items:center;
  pointer-events: none;
}

/* Cada "page" é um cartão/placeholder; <img> só existe quando visível */
.reader .pages .page{
  width: min(100%, 1000px);
  border-radius: 0;                /* sem cantos arredondados */
  background:#12131A;
  overflow: hidden;                /* nada “vaza” do cartão */
  display: block;
  margin-top: -4px;  /* cola as bordas */
  box-sizing: border-box;
  /* Ajuste de altura mínima para evitar vãos grandes no mobile
     (sobrepõe inline style do JS) */
  min-height: 0 !important;
}

/* SINGLE */
.reader .pages .page.single img{
  width:100%;
  height:auto;                     /* preserva proporção */
  display:block;
  margin:0; padding:0;
  border:0;                        /* borda no cartão, não na imagem */
  background:#12131A;
  box-sizing: border-box;
  border-radius:0;                 /* sem cantos arredondados */
}

/* DOUBLE: duas imagens no mesmo cartão SEM QUALQUER espaço/risco */
.reader .pages .page.double{
  display:flex;
  flex-direction: row;
  gap:0;                           /* sem gap entre imagens */
  align-items: stretch;
}
.reader .pages .page.double img{
  flex: 0 0 50%;
  width:50%;
  height:auto;                     /* preserva proporção */
  display:block;
  margin:0; padding:0;
  border:0;                        /* borda no cartão, não na imagem */
  background:#12131A;
  image-rendering: auto;
  box-sizing: border-box;
  border-radius:0;                 /* sem cantos arredondados */
}
/* Overlap sutil para eliminar hairline em alta densidade */
.reader .pages .page.double img + img{
  margin-left: -1px;
}

/* Bottom menu */
.chapter-bottom{
  max-width:1000px; margin:24px auto 80px; background:#1f2026; border:1px solid #2a2c35; border-radius:22px; padding:18px;
  box-sizing: border-box;
}
.nav-actions{ display:flex; gap:10px; justify-content:space-between; align-items:center; flex-wrap:wrap; }
.btn.nav{ width:auto; background:#2a2c35; color:#fff; border:1px solid #20222b; }
.btn.nav.like{ display:inline-flex; align-items:center; gap:8px; }
.btn.nav:hover{ filter:brightness(1.06); }
.hint{ text-align:center; color:#c9ced6; margin-top:8px; }

/* ===== Mobile ===== */
@media (max-width:720px){
  .reader .title{ flex-direction:column; align-items:flex-start; gap:4px; }
  .reader .pages{ gap:0px; }       /* espaçamento menor entre páginas */
  /* placeholders ainda menores no mobile para não criar “vão” */
  .reader .pages .page.single{ min-height: 24vh !important; }
  .reader .pages .page.double{ min-height: 20vh !important; }
  .nav-actions{ justify-content:center; }
}

/* Evita scroll horizontal global */
html, body{
  max-width: 100%;
  overflow-x: hidden;
}

/* Força a fonte padrão do site na leitura de Light Novel,
   ignorando qualquer font-family colado pelo usuário */
.reader .content {
  font-family: 'Poppins', Arial, sans-serif !important;
}

/* Todo conteúdo interno herda essa mesma fonte,
   mesmo que venha com style="font-family: ..." no HTML */
.reader .content * {
  font-family: inherit !important;
}

/* ===== Footer institucional ===== */
.site-footer1{
  margin-top: 10px;
  margin-bottom: -5px;
  padding: 14px 20px 28px; /* topo menor: de 24px para 14px */
  background: #0E0F12;
  border-top: 1px solid #1C1D26;
  box-shadow: 0 -6px 24px rgba(0,0,0,.45);
}

.site-footer-inner1{
  max-width: 1040px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start; /* sobe o conteúdo */
  justify-content: space-between;
  gap: 10px 18px;
  font-size: .85rem;
  color: #9CA3AF;
  min-height: 80px; /* garante uma altura mínima visual */
}

/* Mobile: footer ainda mais alto por causa do menu inferior */
@media (max-width: 720px){
  .site-footer1{
    margin-bottom: 0px; /* antes era 96px */
    padding: 14px 16px 26px;
    height: 200px;
  }
  .site-footer-inner1{
    flex-direction: column;
    align-items: flex-start;
  }
}
