/* LP Flipbook 8.3.1 */
.lp-wrap{ --lp-max-h:85vh; --lp-toolbar-h:46px; position:relative; width:100%; display:block; font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif; color:#fff; }
.lp-stage{ position:relative; overflow:hidden; border-radius:12px; background:rgba(18,18,22,.65); backdrop-filter:saturate(120%) blur(6px); }
.lp-viewport{ position:relative; width:100%; max-height:var(--lp-max-h); margin:0 auto; padding:8px; }
.lp-nav{ position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; line-height:42px; text-align:center; border-radius:999px; background:rgba(0,0,0,.5); color:#fff; border:none; cursor:pointer; z-index:5; }
.lp-prev{ left:8px; } .lp-next{ right:8px; }
.lp-nav:hover{ background:rgba(0,0,0,.7); }

.lp-toolbar{ position:sticky; bottom:0; z-index:6; display:flex; align-items:center; gap:8px; padding:8px 10px; background:rgba(10,10,14,.85); backdrop-filter:blur(6px); border-radius:10px 10px 0 0; }
.lp-tb{ width:36px; height:36px; line-height:36px; border-radius:8px; border:1px solid rgba(255,255,255,.15); background:#1b1e27; color:#fff; cursor:pointer; }
.lp-pages{ margin:0 6px; font-weight:600; }
.lp-spacer{ flex:1; }
.lp-brand{ color:#8ab4ff; text-decoration:none; padding:0 6px; font-size:12px; }

/* vendor host */
.lp-host{ position:relative; width:100%; height:calc(var(--lp-max-h) - var(--lp-toolbar-h) - 8px); margin:0 auto; }
.lp-host .stf__wrapper{ width:100%; height:100%; }

/* Modal thumbnails */
.lp-modal{ position:fixed; inset:0; display:none; z-index:50; }
.lp-modal.--open{ display:block; }
.lp-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.55); }
.lp-modal__body{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(96vw,960px); max-height:90vh; background:#111; border-radius:12px; box-shadow:0 20px 60px rgba(0,0,0,.5); display:flex; flex-direction:column; }
.lp-modal__head{ display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.08); font-weight:600; }
.lp-modal__close{ width:34px; height:34px; border-radius:8px; border:1px solid rgba(255,255,255,.12); background:#1b1e27; color:#fff; cursor:pointer; }
.lp-thumb-grid{ padding:12px; display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; overflow:auto; }
.lp-thumb{ position:relative; background:#0e0e12; border-radius:8px; overflow:hidden; border:1px solid rgba(255,255,255,.1); cursor:pointer; }
.lp-thumb img{ display:block; width:100%; height:160px; object-fit:cover; }
.lp-thumb__num{ position:absolute; right:6px; bottom:6px; background:rgba(0,0,0,.55); padding:2px 6px; border-radius:6px; font-size:12px; }
.lp-thumb.--active{ outline:2px solid #8ab4ff; }

/* hide source imgs */
.lp-src{ display:none!important; }

@media (max-width:1024px){
  .lp-viewport{ padding:6px; }
  .lp-nav{ width:38px;height:38px;line-height:38px; }
  .lp-toolbar{ height:var(--lp-toolbar-h); }
  .lp-host{ height:calc(var(--lp-max-h) - var(--lp-toolbar-h)); }
}


/* === LP Flipbook 8.3.3 UI tweaks === */
.lp-viewport, .lp-stage { border:none !important; outline:none !important; box-shadow:none !important; }
.lp-viewport{ padding:0 !important; background:transparent !important; }
.lp-stage{ background:transparent; }

/* Menubar centered and raised a bit to make room for brandbar */
.lp-toolbar{ justify-content:center; margin:0 auto; gap:12px; bottom:44px; }

/* Brand bar at very bottom */
.lp-brandbar{ position:sticky; bottom:0; z-index:5; text-align:center; padding:8px 12px; 
  font-size:13px; color:#cfd8dc; background:rgba(10,10,14,.85); backdrop-filter:blur(6px); }
.lp-brandbar a{ color:#8ab4ff; text-decoration:none; }
.lp-brandbar a:hover{ text-decoration:underline; }

/* Ensure toolbar buttons align center */
.lp-tb{ display:flex; align-items:center; justify-content:center; }


/* === Căn giữa trang bìa LP Flipbook 8.3.4 === */
@media (min-width: 768px) {
  .lp-cover-page {
    margin: 0 auto !important;
    display: flex !important;
    justify-content: center;
  }
  .lp-cover-page canvas {
    margin: 0 auto !important;
    display: block;
  }
}

/* Orientation toggle button */
.lp-tb.lp-orient{ width:36px; height:36px; display:flex; align-items:center; justify-content:center; }
.lp-orient__icon{ font-size:16px; line-height:1; }
