/* WW Epaper v1.2.0 overrides — per client request
   1) Left Sidebar fixed height 1300px
   2) Thumbnails uncropped (preserve aspect ratio)
   3) Left Sidebar narrower
*/
.ww-ep-wrap{
  grid-template-columns: 200px 1fr 260px !important; /* narrower left sidebar */
}
.ww-ep-left{
  height: 1300px !important;
  max-height: none !important;
}
/* Ensure thumbnails are not cropped */
.ww-ep-thumb{
  overflow: visible !important;
}
.ww-ep-thumb img{
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}


/* WW Epaper v1.2.3 — Professional mobile friendly layout
   Scope: frontend only; keeps existing desktop layout unchanged. */
.ww-ep-wrap,
.ww-ep-wrap *{box-sizing:border-box;}
.ww-ep-wrap{width:100%;max-width:100%;align-items:start;}
.ww-ep-middle{min-width:0;overflow:hidden;}
.ww-ep-image-holder{width:100%;max-width:100%;margin:0 auto;text-align:center;}
#ww-ep-main-img{width:auto;max-width:100%;height:auto;margin:0 auto;}
.ww-ep-thumb.active{border-color:#1e40af;background:#eef4ff;box-shadow:0 0 0 2px rgba(30,64,175,.12) inset;}
.ww-ep-pagebar{justify-content:center;}
.ww-ep-right .ui-datepicker{max-width:100%;}

@media (max-width: 1180px){
  .ww-ep-wrap{grid-template-columns:170px minmax(0,1fr) 230px !important;gap:10px !important;}
  .ww-ep-left{height:auto !important;max-height:75vh !important;}
  .ww-ep-right{height:auto !important;max-height:none !important;}
  .ww-ep-pagebar .ww-ep-num{min-width:34px !important;height:34px !important;padding:5px 9px !important;}
}

@media (max-width: 900px){
  .ww-ep-wrap{display:flex !important;flex-direction:column !important;gap:12px !important;width:100% !important;max-width:100% !important;}
  .ww-ep-middle{order:1;width:100% !important;padding:8px !important;border-radius:10px;}
  .ww-ep-left{order:2;width:100% !important;height:auto !important;max-height:none !important;overflow-x:auto !important;overflow-y:hidden !important;padding:8px !important;border-radius:10px;-webkit-overflow-scrolling:touch;}
  .ww-ep-right{order:3;width:100% !important;height:auto !important;max-height:none !important;padding:10px !important;border-radius:10px;}
  .ww-ep-thumbs{display:flex !important;flex-direction:row !important;gap:8px !important;overflow-x:auto !important;overflow-y:hidden !important;padding:2px 2px 8px !important;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
  .ww-ep-thumb{flex:0 0 96px !important;min-width:96px !important;padding:5px !important;border-radius:8px !important;scroll-snap-align:start;}
  .ww-ep-thumb img{max-height:132px !important;object-fit:contain !important;}
  .ww-ep-thumb-title{font-size:12px !important;line-height:1.25 !important;margin-top:5px !important;white-space:normal !important;}
  .ww-ep-top-controls{display:flex !important;flex-direction:column !important;align-items:stretch !important;justify-content:flex-start !important;gap:8px !important;margin-bottom:8px !important;}
  .ww-ep-top-controls .ww-ep-top-actions{position:static !important;display:flex !important;justify-content:center !important;width:100% !important;}
  .ww-ep-pagebar{display:flex !important;justify-content:flex-start !important;gap:6px !important;overflow-x:auto !important;overflow-y:hidden !important;white-space:nowrap !important;padding:2px 0 6px !important;-webkit-overflow-scrolling:touch;}
  .ww-ep-pagebar .ww-ep-num{flex:0 0 auto !important;min-width:36px !important;width:auto !important;height:36px !important;border-radius:999px !important;font-size:13px !important;padding:5px 10px !important;}
  .ww-ep-top-actions .ww-ep-btn{width:100% !important;max-width:240px !important;height:38px !important;}
  .ww-ep-bottom-nav{gap:8px !important;margin-top:10px !important;}
  .ww-ep-bottom-nav .btn-prev,
  .ww-ep-bottom-nav .btn-next{flex:1 1 0 !important;min-width:0 !important;height:40px !important;padding:8px 10px !important;font-size:13px !important;}
  #ww-ep-main-img{width:100% !important;max-width:100% !important;}
  #ww-ep-datepicker{height:40px !important;font-size:16px !important;border-radius:8px !important;padding:8px 10px !important;}
  .ww-ep-date-hint{text-align:center;font-size:13px;margin-top:6px;}
  #ww-ep-popup{padding:10px !important;align-items:center !important;}
  #ww-ep-popup .popup-content{width:100% !important;max-width:96vw !important;max-height:92vh !important;padding:8px !important;border-radius:12px !important;overflow:auto !important;}
  #ww-ep-popup .close-btn{right:10px !important;top:6px !important;font-size:30px !important;line-height:1 !important;z-index:5;}
  #ww-ep-popup iframe{width:92vw !important;height:78vh !important;max-width:100% !important;}
}

@media (max-width: 600px){
  .ww-ep-wrap{gap:10px !important;}
  .ww-ep-middle,.ww-ep-left,.ww-ep-right{border-radius:8px !important;}
  .ww-ep-middle{padding:6px !important;}
  .ww-ep-thumb{flex-basis:78px !important;min-width:78px !important;}
  .ww-ep-thumb img{max-height:108px !important;}
  .ww-ep-thumb-title{font-size:11px !important;}
  .ww-ep-pagebar .ww-ep-num{min-width:32px !important;height:32px !important;font-size:12px !important;padding:4px 8px !important;}
  .ww-ep-top-actions .ww-ep-btn{height:36px !important;font-size:13px !important;}
  .ww-ep-bottom-nav .btn-prev,
  .ww-ep-bottom-nav .btn-next{height:38px !important;font-size:12px !important;border-radius:999px !important;}
  .ww-ep-right{padding:8px !important;}
  #ww-ep-inline-calendar .ui-datepicker{font-size:13px !important;padding:6px !important;}
  #ww-ep-inline-calendar th{padding:5px 0 !important;font-size:12px !important;}
  #ww-ep-inline-calendar .ui-state-default{padding:7px 0 !important;font-size:12px !important;}
  .ui-datepicker{max-width:100% !important;}
}

@media (max-width: 380px){
  .ww-ep-thumb{flex-basis:70px !important;min-width:70px !important;}
  .ww-ep-pagebar .ww-ep-num{min-width:30px !important;height:30px !important;padding:3px 7px !important;}
  .ww-ep-bottom-nav{flex-direction:column !important;}
}