/* Verse popovers (site/refs.js) and footnote popovers in the Bible reader.
   Colors come from the tokens in site.css. */
:root{--hl:#FFF3C4}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--hl:#3A3418}}
:root[data-theme="dark"]{--hl:#3A3418}

.ybl-ref,.fnw{position:relative;display:inline}
.ybl-ref-btn{font:inherit;color:var(--context);background:none;border:0;padding:0;margin:0;cursor:pointer;
  text-decoration:underline;text-decoration-style:dotted;text-decoration-thickness:1.5px;text-underline-offset:3px}
.ybl-ref-btn[aria-expanded="true"]{text-decoration-style:solid}
.ybl-pop{position:absolute;left:0;top:calc(100% + 8px);z-index:30;width:min(380px,calc(100vw - 40px));
  display:flex;flex-direction:column;gap:8px;text-align:left;
  background:var(--panel);border:1px solid var(--rule);border-radius:6px;box-shadow:0 8px 28px var(--shadow);
  padding:13px 15px 12px;font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:14px;line-height:1.45;color:var(--ink);
  text-indent:0;font-weight:400;letter-spacing:normal;text-transform:none}
.ybl-pop[hidden]{display:none}
.ybl-pop-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.ybl-pop-ref{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:12.5px;font-weight:500;color:var(--context)}
.ybl-pop-tr{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ybl-pop-text{font-family:Spectral,Georgia,serif;font-size:16px;line-height:1.55;color:var(--ink);max-height:16em;overflow-y:auto}
.ybl-pop-text sup{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:.62em;color:var(--muted);margin-right:.25em;vertical-align:.45em;line-height:0}
.ybl-pop-more{color:var(--muted)}
.ybl-pop-note{font-size:13px;color:var(--muted)}
.ybl-pop-go{font-size:13px;font-weight:500;color:var(--context);text-decoration:none;align-self:flex-start}
.ybl-pop-go:hover{text-decoration:underline}
.ybl-sc{font-variant:small-caps;letter-spacing:.03em}
@media (max-width:480px){
  .ybl-pop{position:fixed;left:0 !important;right:0;top:auto;bottom:0;width:auto;border-radius:10px 10px 0 0;
    padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));
    padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
}