/* ==========================================================================
   VideoAsk Widget
   Companion styles for the floating "Apply Now" widget that VideoAsk's
   embed.js injects on postings with application_mode = videoask.
   ========================================================================== */

/* LIFT ABOVE MOBILE TABBAR
   The widget renders its button bottom-left; on phones the global
   .navigation-tabbar (fixed bottom, ~96px tall + safe area) sits in the same
   spot, so the button overlaps the tabbar icons.

   VideoAsk positions the button from an injected <style> using a two-class
   selector with !important, e.g.
     .videoask-embed__button_circle--9FNiq.videoask-embed__button_bottom--B {
       bottom: 27px !important;
     }
   That is specificity (0,2,0) + !important, injected after our stylesheet.
   The selector below is element + two attribute matches = (0,2,1), also
   !important, so it wins. The button always carries a "videoask-embed__button"
   class and a "_bottom" position class (we use position: bottom-left), so the
   partial-class matches survive VideoAsk's randomized hash suffixes.
   ========================================================================== */

/* Phone + Tablet Portrait - Max 899px */
@media (max-width: 899px) {
  button[class*="videoask-embed__button"][class*="_bottom"] {
    bottom: calc(96px + env(safe-area-inset-bottom, 0px) + 16px) !important;
    /* VideoAsk also nudges the button down with transform: translateY(70px).
       That shift eats into the lift above and drops it back onto the tabbar,
       so we zero it out. The transform is a pure translate, so removing it
       only cancels the downward nudge. */
    transform: none !important;
  }
}