/* WeeklyPress / Jomhour Daily v31: vertical side-page table + controlled non-scrolling news tabs.
   Modern homepage only; archive, single issue, PDF mapping, and hotspot overlay untouched. */
.jdp-home.jdp-v31 { padding-top:5px!important; padding-bottom:12px!important; }
.jdp-v31 .jdp-main-layout {
  grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  gap:clamp(10px,1.1vw,18px);
  align-items:start;
}
.jdp-v31 .jdp-cover-section,.jdp-v31 .jdp-reader { min-width:0; }
.jdp-v31 .jdp-v31-reading-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) var(--jdp-rail-width,76px);
  gap:9px;
  min-width:0;
  align-items:stretch;
  direction:rtl;
}
.jdp-v31 .jdp-v31-reading-layout .jdp-cover-frame {
  min-width:0;
  width:100%;
  margin:0!important;
  padding:0!important;
  align-items:flex-start;
  justify-content:center;
}
.jdp-v31 .jdp-v31-reading-layout .jdp-cover-stage {
  margin:0 auto;
  max-width:100%!important;
  flex:none!important;
  height:auto!important;
  aspect-ratio:.707;
  overflow:hidden;
}
/* The rail sits in the same vertical footprint as the cover, rather than costing a second row. */
.jdp-v31 .jdp-v31-page-table {
  display:block!important;
  box-sizing:border-box;
  position:relative;
  width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  padding:30px 4px 4px!important;
  margin:0!important;
  border:1px solid #e2e7ef!important;
  border-radius:9px!important;
  background:#f9fafc!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.jdp-v31 .jdp-v31-page-table__title {
  position:absolute;
  inset:0 4px auto;
  margin:0;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  color:#526174;
  border-bottom:1px solid #e5e9ef;
  font-weight:800;
}
.jdp-v31 .jdp-v31-page-table .jdp-pages__rail {
  position:absolute;
  top:31px;right:4px;left:4px;bottom:4px;
  width:auto;
  height:auto;
  margin:0;
  padding:1px 1px 5px!important;
  display:flex!important;
  flex-direction:column!important;
  flex-wrap:nowrap!important;
  align-items:stretch;
  gap:6px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scroll-snap-type:y proximity;
  scrollbar-width:thin;
  overscroll-behavior:contain;
}
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb {
  box-sizing:border-box;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  flex:0 0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  padding:4px 2px!important;
  gap:3px!important;
  border:1px solid #dce2eb;
  border-radius:6px!important;
  box-shadow:none!important;
  color:#344458;
  background:#fff;
  scroll-snap-align:start;
}
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb:hover,
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb:focus-visible { border-color:#be1836; outline:2px solid rgba(190,24,54,.18); }
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb.is-active { border-color:#bd1532!important; background:#fff3f5; box-shadow:inset 0 0 0 1px #bd1532!important; }
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb :is(img,.jdp-page-thumb__pdf,.jdp-page-thumb__placeholder) {
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:.707;
  object-fit:contain;
  display:block;
  border:0;
  border-radius:3px;
  background:#fff;
}
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb__placeholder { display:grid; place-items:center; }
.jdp-v31 .jdp-v31-page-table .jdp-page-thumb__label {
  font-size:9px!important;
  line-height:1.35;
  white-space:nowrap;
  text-align:center;
  padding:0;
}
/* The news area never becomes a nested scroll container. Number of cards is selected in settings. */
.jdp-v31 .jdp-topic__panel>.jdp-news__list,
.jdp-v31.jdp-v29--news-scroll .jdp-topic__panel>.jdp-news__list {
  overflow:visible!important;
  max-height:none!important;
  min-height:0!important;
  scrollbar-width:none;
  padding:0!important;
}
.jdp-v31 .jdp-news-card { min-height:0!important; }
.jdp-v31 .jdp-news__list { gap:7px; }
.jdp-v31 .jdp-topic__tabs{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
@media(min-width:881px){
  /* Vertical thumbnails free room for a cover 30–70px taller than in v30. */
  .jdp-v31.jdp-v30--expanded .jdp-v31-reading-layout .jdp-cover-stage {
    width:min(100%, clamp(270px, calc((100dvh - 180px) * .707), 700px))!important;
    max-height:none!important;
    aspect-ratio:.707!important;
  }
  .jdp-v31:not(.jdp-v30--expanded) .jdp-v31-reading-layout .jdp-cover-stage {
    width:min(100%,var(--jdp-cover-max,760px))!important;
    max-height:min(var(--jdp-cover-height,780px),calc(100dvh - 180px));
  }
}
@media(min-width:881px) and (max-height:650px) {
  .jdp-v31.jdp-v30--expanded .jdp-v31-reading-layout .jdp-cover-stage {
    width:min(100%,max(225px,calc((100dvh - 165px)*.707)))!important;
  }
}
@media(max-width:880px){
  .jdp-v31 .jdp-main-layout{grid-template-columns:minmax(0,1fr)}
  .jdp-v31 .jdp-v31-reading-layout{grid-template-columns:minmax(0,1fr) var(--jdp-rail-width,76px);gap:7px}
  .jdp-v31.jdp-v30--expanded .jdp-v31-reading-layout .jdp-cover-stage{width:100%!important;max-width:610px!important;height:auto!important;aspect-ratio:.707}
}
@media(max-width:540px){
  .jdp-v31 .jdp-v31-reading-layout{grid-template-columns:minmax(0,1fr) 53px;gap:5px}
  .jdp-v31 .jdp-v31-page-table{padding:24px 2px 2px!important}
  .jdp-v31 .jdp-v31-page-table__title{height:22px;font-size:9px}
  .jdp-v31 .jdp-v31-page-table .jdp-pages__rail{top:24px;left:2px;right:2px;bottom:2px;gap:4px!important}
  .jdp-v31 .jdp-v31-page-table .jdp-page-thumb{padding:2px 1px!important}
  .jdp-v31 .jdp-v31-page-table .jdp-page-thumb__label{font-size:8px!important}
}
/* Keep the page table immediately beside the newspaper rather than at the far edge of a wide column. */
@media(min-width:881px){
 .jdp-v31 .jdp-v31-reading-layout{
  width:min(100%, calc((100dvh - 206px) * .707 + var(--jdp-rail-width,76px) + 9px));
  margin-inline:auto;
 }
 .jdp-v31.jdp-v30--expanded .jdp-v31-reading-layout .jdp-cover-stage{
  width:min(100%,max(250px,calc((100dvh - 206px)*.707)))!important;
 }
}
