/* ==========================================================================
   Paya Jalali — stacking fixes for the date picker
   --------------------------------------------------------------------------
   Loaded after jalalidatepicker.min.css so it wins on equal specificity.
   ========================================================================== */

/* The picker ships with `z-index: 9999 !important` on its container. That is
   comfortably above a Bootstrap modal (1050), but not above this
   installation: Perfex's own stylesheets use values as high as
   99999999999, so the calendar ends up painted underneath overlays such as
   the new-event dialog.

   The value below is just under the 32-bit signed maximum, which is the
   practical ceiling browsers accept, so nothing in the application can
   out-stack it. `!important` is required because the library's own rule is
   also marked important. */
jdp-container {
  z-index: 2147483000 !important;
}

/* The library sets `position: fixed` inline, which beats the stylesheet's
   `position: absolute`. Stated here as well so the two agree and the
   coordinates the library calculates are interpreted against the viewport. */
jdp-container {
  position: fixed;
}

/* Persian text inside the calendar should use the same face as the rest of
   the page rather than falling back to a system font.

   This previously read `font-family: 'IRANSansX', inherit, sans-serif`, which
   never worked: `inherit` is not a valid entry inside a font-family list, so
   the browser discarded the whole declaration. It also named a font this
   module has no @font-face for, so even a corrected list would have resolved
   to nothing.

   Inheriting from the page is the right behaviour anyway — when the design
   system is on, that is the configured body font; when it is off, it is
   whatever Perfex uses. The design system layer sets an explicit face on
   jdp-container in ds-perfex-admin.css. */
jdp-container,
jdp-container input,
jdp-container button {
  font-family: inherit;
}
