/* Breakthrough announcement engine — base chrome. Campaign body_css layers on top. */
.bbann-root { position: fixed; z-index: 2147483000; }
.bbann-overlay {
  position: fixed; inset: 0; background: rgba(15, 20, 32, 0.62);
  opacity: 0; transition: opacity .3s ease;
}
.bbann-root.bbann-visible .bbann-overlay { opacity: 1; }
.bbann-close {
  position: absolute; top: 8px; right: 8px; z-index: 5;
  width: 32px; height: 32px; line-height: 32px; text-align: center;
  font-size: 26px; font-weight: 700; color: #8b93a3; background: transparent; border: 0;
  cursor: pointer; border-radius: 50%; transition: background .15s, color .15s;
}
.bbann-close:hover { background: var(--bbann-close-hbg, rgba(0,0,0,.07)); color: var(--bbann-close-hcolor, #1c2433); }
.bbann-box {
  position: relative; background: #fff; box-sizing: border-box;
  box-shadow: 0 18px 60px rgba(8, 15, 30, .35);
  font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
}
.bbann-body { padding: 0; }
/* simple/admin popups (no per-row backgrounds) still get comfortable padding */
.bbann-body > .bbann-text:first-child,
.bbann-body > form { padding-left: 26px; padding-right: 26px; }

/* ── builder layout (rows/columns/text/image faithfully ported from OM) ── */
.bbann-row { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 0; }
/* OM top-aligns column content (alignItems:flex-start, no justifyContent) */
.bbann-col { flex: 1 1 0; min-width: 0; box-sizing: border-box; display: flex; flex-direction: column; justify-content: flex-start; }
.bbann-text { } /* inline styles from OM rawHTML carry the typography */
/* OM resets element margins to 0 — line spacing comes from inline line-height
   and per-block margins, NOT <p> margins. Keep ours out of the way (else the
   code box reads bottom-heavy and paragraphs over-space). */
.bbann-body .bbann-text p,
.bbann-body .bbann-text h1, .bbann-body .bbann-text h2,
.bbann-body .bbann-text h3, .bbann-body .bbann-text h4 { margin: 0; }
.bbann-text ul { margin: .5em 0; padding-left: 22px; text-align: left; }
.bbann-text li { margin: .3em 0; }
.bbann-img { max-width: 100%; height: auto; display: block; margin: 0 auto; }
.bbann-button { display: inline-block; }
/* evergreen countdown timer — the blue pill (cell) wraps number + label */
.bbann-countdown { display: flex; gap: 0; justify-content: center; align-items: center; margin: 12px 0; }
.bbann-cd-cell { line-height: 1.05; }   /* inline style adds the blue pill + inline-block */
.bbann-cd-num { display: block; line-height: 1; }
.bbann-cd-unit { display: block; font-style: normal; margin-top: 2px; }
/* section-bg campaigns: rows paint their own background, so no body padding (no frame) */
.bbann-fullbleed .bbann-body { padding: 0 !important; }
/* teaser/toggle slide: a small clickable bar that auto-expands to the slide */
.bbann-teaser { position: fixed; right: 18px; bottom: 18px; display: none; cursor: pointer; text-align: center; line-height: 1.2; z-index: 1; max-width: calc(100vw - 24px); }
.bbann-has-teaser .bbann-teaser { display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; }
.bbann-teaser-plus { margin-left: 10px; font-weight: 700; line-height: 1; opacity: .95; }
.bbann-has-teaser .bbann-box { display: none; }
@media (max-width: 600px) { .bbann-teaser { right: 0; left: 0; bottom: 0; } }

/* collapsed "close" slide: show only the first heading as a clickable tab */
.bbann-collapsed .bbann-box { cursor: pointer; }
.bbann-collapsed .bbann-body, .bbann-collapsed .bbann-row { padding: 0 !important; }
.bbann-collapsed .bbann-col { padding: 12px 18px !important; }
.bbann-collapsed .bbann-col > *:not(:first-child) { display: none !important; }
/* honeypot fields (OM's hidden anti-spam inputs) must stay in the form & submit,
   but never be visible — pin them off-screen regardless of inherited input styles */
.bbann-body .honeycontainer,
.bbann-body input.filpot, .bbann-body input.emtpot {
  position: absolute !important; left: -9999px !important; top: auto !important;
  width: 1px !important; height: 1px !important; padding: 0 !important; margin: 0 !important;
  overflow: hidden !important; opacity: 0 !important; border: 0 !important;
}
.bbann-body form { margin: 12px 0 0; }
@media (max-width: 600px) {
  .bbann-row { flex-direction: column; }
  .bbann-col { flex: 1 1 100% !important; max-width: 100% !important; }
}

/* ── centered announcement ── */
.bbann-type-center, .bbann-type-fullscreen {
  inset: 0; display: flex; align-items: center; justify-content: center;
}
.bbann-type-center .bbann-box {
  width: 560px; max-width: calc(100vw - 28px); max-height: calc(100vh - 28px);
  overflow: auto; border-radius: 12px;
  transform: translateY(14px) scale(.98); opacity: 0; transition: transform .3s ease, opacity .3s ease;
}
.bbann-type-center.bbann-visible .bbann-box { transform: none; opacity: 1; }

/* ── fullscreen ── */
.bbann-type-fullscreen .bbann-overlay { background: rgba(15, 20, 32, .96); }
.bbann-type-fullscreen .bbann-box {
  width: 100vw; height: 100vh; max-width: 100vw; max-height: 100vh;
  display: flex; align-items: center; justify-content: center; overflow: auto;
  opacity: 0; transition: opacity .3s ease;
}
.bbann-type-fullscreen.bbann-visible .bbann-box { opacity: 1; }

/* ── slide-in (bottom-right) ── */
.bbann-type-slide { right: 18px; bottom: 18px; left: auto; top: auto; max-width: calc(100vw - 24px); }
.bbann-type-slide .bbann-box {
  width: 360px; max-width: calc(100vw - 24px); border-radius: 12px;
  transform: translateY(120%); transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
.bbann-type-slide.bbann-visible .bbann-box { transform: none; }
.bbann-type-slide .bbann-body { padding: 26px 22px 22px; }

/* ── floating bar (top) ── */
.bbann-type-floating { left: 0; right: 0; top: 0; bottom: auto; }
.bbann-type-floating .bbann-box {
  width: 100%; border-radius: 0; box-shadow: 0 4px 18px rgba(8,15,30,.2);
  transform: translateY(-100%); transition: transform .35s ease;
}
.bbann-type-floating.bbann-visible .bbann-box { transform: none; }
.bbann-type-floating .bbann-body { padding: 12px 54px 12px 22px; text-align: center; }
.bbann-type-floating .bbann-close { top: 50%; transform: translateY(-50%); }

/* ── default body typography (overridable by campaign body_css) ── */
.bbann-body h2 { margin: 0 0 10px; font-size: 26px; line-height: 1.2; color: #14213d; }
.bbann-body p { margin: 0 0 14px; font-size: 15px; line-height: 1.5; color: #44506a; }
.bbann-body form { margin: 0; }
/* Default form-control styling for admin-authored popups only. Ported OM forms
   carry .om* classes already styled by style-2018wf.css — never override those
   (the :not([class*=om]) guards keep our green/orange buttons off OM's). */
.bbann-body input[type=email]:not([class*="om"]), .bbann-body input[type=text]:not([class*="om"]), .bbann-body select:not([class*="om"]) {
  width: 100%; box-sizing: border-box; padding: 12px 14px; margin: 0 0 10px;
  font-size: 15px; border: 1px solid #cdd3df; border-radius: 7px;
}
.bbann-body button[type=submit]:not([class*="om"]), .bbann-body input[type=submit]:not([class*="om"]), .bbann-body .bbann-cta {
  display: inline-block; width: 100%; box-sizing: border-box; cursor: pointer;
  padding: 13px 18px; font-size: 16px; font-weight: 700; color: #fff;
  background: #e8662a; border: 0; border-radius: 7px; transition: background .15s;
}
.bbann-body button[type=submit]:not([class*="om"]):hover, .bbann-body input[type=submit]:not([class*="om"]):hover, .bbann-body .bbann-cta:hover { background: #cf5519; }
.bbann-body .bbann-fineprint { font-size: 12px; color: #8b93a3; margin: 10px 0 0; text-align: center; }

/* page scroll-lock for modal types */
body.bbann-open-center, body.bbann-open-fullscreen { overflow: hidden; }

@media (max-width: 600px) {
  .bbann-type-center .bbann-box { width: calc(100vw - 20px); }
  .bbann-type-slide { right: 0; left: 0; bottom: 0; }
  /* !important so the full-width bottom sheet beats the inline box.style.width
     the engine sets from settings.width (e.g. the 300px hoops slide). */
  .bbann-type-slide .bbann-box { width: 100% !important; border-radius: 12px 12px 0 0; }
  .bbann-body { padding: 30px 20px 22px; }
}

/* ── OM form-control styles (copied from style-2018wf.css, scoped) so popups
   are self-contained and the admin editor preview styles identically ── */
/* OM forms assume border-box. Force it so a host page without the box-sizing
   reset can't make the width:100% + padding inputs overflow the popup (the
   live content pages lacked the reset the admin backend has). */
.bbann-box input, .bbann-box select, .bbann-box button, .bbann-box textarea { box-sizing: border-box !important; }
.bbann-body input.omtextinput { color: #666878 !important; font-size: 20px !important; font-weight: 700 !important; font-family: Lato !important; background: #f9fbff !important; border-style: solid !important; border-color: rgba(60, 91, 151, 0.28) !important; border-top-width: 2px !important; border-right-width: 2px !important; border-bottom-width: 2px !important; border-left-width: 2px !important; border-top-left-radius: 5px !important; border-top-right-radius: 5px !important; border-bottom-right-radius: 5px !important; border-bottom-left-radius: 5px !important; display: block !important; margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 10px !important; margin-left: 0px !important; padding-top: 0px !important; padding-right: 20px !important; padding-bottom: 0px !important; padding-left: 20px !important; max-width: 100% !important; width: 100% !important; height: auto !important; line-height: normal !important; }
.bbann-body input.omsubmitbutton { background: #0ac208 !important; border-bottom-left-radius: 5px !important; border-bottom-right-radius: 5px !important; border-bottom-width: 0px !important; border-color: rgba(0,0,0,.35) !important; border-left-width: 0px !important; border-right-width: 0px !important; border-style: none !important; border-top-left-radius: 5px !important; border-top-right-radius: 5px !important; border-top-width: 0px !important; box-shadow: 0px 0px 0px 0px #ffffff !important; color: #ffffff !important; font-family: Lato !important; font-size: 23px !important; font-weight: 800 !important; -webkit-letter-spacing: 0 !important; -moz-letter-spacing: 0 !important; -ms-letter-spacing: 0 !important; letter-spacing: 0 !important; line-height: 1 !important; margin-bottom: 0px !important; margin-left: 0px !important; margin-right: 0px !important; margin-top: 0px !important; max-width: 100% !important; padding-bottom: 20px !important; padding-left: 12px !important; padding-right: 12px !important; padding-top: 20px !important; text-transform: none !important; -webkit-text-decoration: none !important; text-decoration: none !important; width: 100% !important; cursor: pointer; }
.bbann-body input.omsubmitbutton:hover { background: #05f602 !important; box-shadow: 0px 0px 0px 0px #ffffff !important; color: #ffffff !important; font-family: Lato !important; font-size: 20px !important; font-weight: 800 !important; -webkit-letter-spacing: 0 !important; -moz-letter-spacing: 0 !important; -ms-letter-spacing: 0 !important; letter-spacing: 0 !important; line-height: 1 !important; text-transform: none !important; -webkit-text-decoration: none !important; text-decoration: none !important; border-bottom-left-radius: 5px !important; border-bottom-right-radius: 5px !important; border-bottom-width: 0px !important; border-color: rgba(0,0,0,.35) !important; border-left-width: 0px !important; border-right-width: 0px !important; border-style: none !important; border-top-left-radius: 5px !important; border-top-right-radius: 5px !important; border-top-width: 0px !important; }
.bbann-body select.omselect { color: #666878 !important; font-size: 20px !important; font-weight: 700 !important; font-family: Lato !important; background: #f9fbff !important; border-style: solid !important; border-color: rgba(60, 91, 151, 0.28) !important; border-top-width: 2px !important; border-right-width: 2px !important; border-bottom-width: 2px !important; border-left-width: 2px !important; border-top-left-radius: 5px !important; border-top-right-radius: 5px !important; border-bottom-right-radius: 5px !important; border-bottom-left-radius: 5px !important; display: block !important; margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 10px !important; margin-left: 0px !important; padding-top: 0px !important; padding-right: 20px !important; padding-bottom: 0px !important; padding-left: 20px !important; max-width: 100% !important; width: 100% !important; } /* mostly copied from omtextinut styles */
/* for ongagemonster exit-intent popups, the textinput and select both have omtextinput and omomselect classes too, but omexitsubmitbutton is by itself and mostly copies btnsubmit*/
.bbann-body input.omexittextinput { display: inline-block !important; margin-left:3% !important; width: 60% !important }
.bbann-body select.omexitselect { display: inline-block !important; width: 36% !important; }
.bbann-body input.omexitsubmitbutton { margin-top: 5px; border: 0; border-radius: 2px; box-sizing: border-box; background: #f3871b; font: 400 20px oswald; color: #ffffff; display: inline-block; width: 100%; height: 54px; padding: 6px 2px 6px 2px; vertical-align: top; text-align: center;  }
.bbann-body input.omexitsubmitbutton:hover { }
@media only screen and (max-width: 891px){
.bbann-body select.omexitselect { width: 100% !important; }
.bbann-body input.omexittextinput { margin-left: 0px !important; width: 100% !important; }
}