/* =========================================================
   SBW Popup Overlay
   ---------------------------------------------------------
   Reusable modal popup for links marked with class="sbw-popup".
   Include on any page with:

     <link rel="stylesheet" href="/assets/css/sbw-popup.css">
     <script src="/assets/js/sbw-popup.js" defer></script>

   Then any anchor works:
     <a class="sbw-popup" href="/some/site/page">Inline preview</a>
     <a class="sbw-popup" href="https://external.example.com/x">Source</a>

   Internal (same-origin) links load in an iframe inside the
   overlay. External links try the iframe first, then fall
   back to opening a new tab if the site refuses to embed.
   ========================================================= */

#sbw-popup {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: none;
  /* Site-tan backdrop (matches --bg #f7f3ea) so the overlay reads as
     'same site, just focused on this page' rather than a dark modal. */
  background: rgba(247, 243, 233, 0.88);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  padding: 3vh 2vw;
}
#sbw-popup.is-open { display: flex; }

#sbw-popup .sbw-popup-panel {
  position: relative;
  margin: auto;
  width: min(1100px, 100%);
  height: min(94vh, 100%);
  background: #fbf9f3;
  border: 1px solid rgba(31, 27, 23, 0.16);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(31, 27, 23, 0.18);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

#sbw-popup .sbw-popup-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(31, 27, 23, 0.28);
  background: #fbf9f3;
  color: #1f1b17;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
#sbw-popup .sbw-popup-close:hover {
  background: #8d3813;
  color: #fff;
  border-color: #8d3813;
}

#sbw-popup .sbw-popup-frame {
  flex: 1 1 auto;
  width: 100%;
  border: 0;
  background: #fbf9f3;
}

/* Fallback banner shown when an external site refuses to embed */
#sbw-popup .sbw-popup-fallback {
  display: none;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  padding: 2rem;
  text-align: center;
  font-family: "Source Sans 3", Arial, sans-serif;
  color: #1f1b17;
}
#sbw-popup.is-fallback .sbw-popup-frame { display: none; }
#sbw-popup.is-fallback .sbw-popup-fallback { display: flex; }
#sbw-popup .sbw-popup-fallback a {
  color: #8d3813;
  font-weight: 600;
}