/* UkuTabs print / PDF preview overlay. Screen UI only; the page layout is handed
   to paged.js from print-preview.js. Cream canvas with a dark settings bar styled
   like the site menu (cream text, brick accents). Namespaced .uku-pp-*. */

.uku-pp-overlay{
  position:fixed; inset:0; z-index:100000; display:none; flex-direction:column;
  background:#f4f1e3; color:#45443f;
  font-family:Roboto,-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
}
.uku-pp-bar{
  flex:0 0 auto; display:flex; align-items:center; gap:8px 16px; flex-wrap:wrap;
  background:#2c2b27; color:#e7e3d6; padding:10px 16px; font-size:13px;
  box-shadow:0 2px 10px rgba(0,0,0,.22);
}
.uku-pp-grp{ display:flex; align-items:center; gap:6px; }
.uku-pp-bar i{ margin-right:6px; }
.uku-pp-bar button:not(.uku-pp-sw){
  cursor:pointer; border:1px solid #6f6c61; background:transparent; color:#ece8da;
  border-radius:6px; padding:0 11px; height:30px; font-weight:600; font-size:13px;
  display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box;
  transition:background .12s ease, color .12s ease, border-color .12s ease;
}
.uku-pp-bar button:not(.uku-pp-sw):hover{ background:rgba(255,255,255,.09); border-color:#8a8676; }
.uku-pp-seg{ gap:0; }
.uku-pp-seg button{ border-radius:0; border-left-width:0; }
.uku-pp-seg button:first-child{ border-radius:6px 0 0 6px; border-left-width:1px; }
.uku-pp-seg button:last-child{ border-radius:0 6px 6px 0; }
.uku-pp-seg button.on{ background:#c7523a; border-color:#c7523a; color:#fff; }
.uku-pp-seg button.on:hover{ background:#d2613f; border-color:#d2613f; }

/* Defensive: the site's own form CSS bleeds into the overlay on live pages, so
   force these so the checkboxes stay centered with the rest of the bar. */
.uku-pp-bar label{ display:flex!important; align-items:center!important; gap:6px; cursor:pointer; height:30px; margin:0!important; padding:0!important; line-height:1.2!important; font-weight:400!important; color:#e7e3d6; }
.uku-pp-bar input[type=checkbox]{ -webkit-appearance:checkbox!important; appearance:checkbox!important; width:14px!important; height:14px!important; min-width:14px; margin:0!important; padding:0!important; vertical-align:middle!important; position:static!important; float:none!important; top:auto!important; cursor:pointer; accent-color:#c7523a; }

.uku-pp-swatches{ gap:7px; }
.uku-pp-swatches.off{ opacity:.4; pointer-events:none; }
.uku-pp-sw{
  width:22px; height:22px; border-radius:5px; padding:0; border:1px solid rgba(255,255,255,.22);
  cursor:pointer; transition:transform .12s ease, box-shadow .12s ease;
}
.uku-pp-sw:hover{ transform:translateY(-1px); box-shadow:0 3px 6px rgba(0,0,0,.4); }
.uku-pp-sw.on{ border-color:transparent; box-shadow:0 0 0 2px #2c2b27, 0 0 0 3px #f4f1e3; }

.uku-pp-count{ font-weight:700; color:#e7e3d6; }
.uku-pp-colnote{ font-size:11px; font-style:italic; color:#b8b3a4; margin-left:2px; }
.uku-pp-colnote[hidden]{ display:none !important; }
.uku-pp-count.fit{ color:#8fd29a; }
.uku-pp-count.over{ color:#eb9a82; }
.uku-pp-go{ background:#c7523a !important; color:#fff !important; border-color:#c7523a !important; }
.uku-pp-go:hover{ background:#d2613f !important; border-color:#d2613f !important; }
.uku-pp-close{ margin-left:auto; border-color:rgba(255,255,255,.28) !important; color:#d9d4c4 !important; }
.uku-pp-close:hover{ background:rgba(255,255,255,.09) !important; }

.uku-pp-preview{ flex:1 1 auto; overflow:auto; padding:26px 26px 56px; }
.uku-pp-msg{ color:#8a8878; font-size:14px; padding:40px; text-align:center; }
.uku-pp-preview .pagedjs_page{
  background:#fff; box-shadow:0 6px 24px rgba(0,0,0,.20); margin:0 auto 22px !important;
}

/* Hide the floating Freestar ads ONLY while the preview is open. The body class is
   added on open and removed on close, so this never affects the rest of the site. */
body.uku-pp-open #fs-sticky-footer,
body.uku-pp-open .fs-sticky-footer,
body.uku-pp-open #ukutabs_sticky_footer,
body.uku-pp-open #FreeStarVideoAdContainer,
body.uku-pp-open #freestar-video-parent{ display:none !important; }

/* Mobile: compact bar, roomier tap targets, tighter preview gutters. The page is
   scaled to fit the width in JS (fitPreview). */
@media (max-width:640px){
  .uku-pp-bar{ gap:8px 10px; padding:8px 10px; }
  .uku-pp-grp:not(.uku-pp-seg){ gap:5px; }
  .uku-pp-bar button:not(.uku-pp-sw){ height:34px; }
  .uku-pp-sw{ width:26px; height:26px; }
  .uku-pp-preview{ padding:12px 6px 44px; }
}

@media print{
  body > *:not(.uku-pp-overlay){ display:none !important; }
  .uku-pp-overlay{ position:static !important; display:block !important; background:#fff !important; }
  .uku-pp-bar{ display:none !important; }
  .uku-pp-preview{ overflow:visible !important; padding:0 !important; }
  .uku-pp-preview .pagedjs_page{ margin:0 !important; box-shadow:none !important; zoom:1 !important; }
  @page{ margin:0 !important; }
}
