/* AMELIAPOS_CATALOG_DRAWER_INPUT_FIX_R16_5R19_3_2 */

/*
 * Root cause:
 * The R19.3 backdrop lives under <body>, while the drawer forms live
 * inside #managementCatalog. A parent stacking context can place the
 * whole drawer below the body-level backdrop even if the drawer itself
 * says z-index:890 and the backdrop says 880.
 *
 * The safe solution is not to stack another global sheet at all.
 * We disable the body-level backdrop and lock the catalog behind the
 * drawer directly.
 */

.catalog-drawer-backdrop,
body.catalog-drawer-open .catalog-drawer-backdrop{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* The Catalog behind an open editor is visually de-emphasized and inert. */
body.catalog-drawer-open #managementCatalog{
  pointer-events:none!important;
}

body.catalog-drawer-open #managementCatalog .master-list-card,
body.catalog-drawer-open #managementCatalog .catalog-admin-tabs,
body.catalog-drawer-open #managementCatalog > header{
  opacity:.93;
}

/* The active drawer is the only interactive area inside Catalog. */
body.catalog-drawer-open #managementCatalog form.catalog-drawer{
  pointer-events:auto!important;
  z-index:2000!important;
  opacity:1!important;
  visibility:visible!important;
}

/* Explicitly restore interaction to all native controls. */
body.catalog-drawer-open #managementCatalog form.catalog-drawer input,
body.catalog-drawer-open #managementCatalog form.catalog-drawer select,
body.catalog-drawer-open #managementCatalog form.catalog-drawer textarea,
body.catalog-drawer-open #managementCatalog form.catalog-drawer button,
body.catalog-drawer-open #managementCatalog form.catalog-drawer label,
body.catalog-drawer-open #managementCatalog form.catalog-drawer .file-action{
  pointer-events:auto!important;
}

/* Keep the drawer visually distinct without requiring an overlay. */
body.catalog-drawer-open #managementCatalog form.catalog-drawer{
  box-shadow:-20px 0 48px rgba(15,35,52,.18)!important;
}

/* Inputs must always sit in the interactive plane. */
body.catalog-drawer-open #managementCatalog form.catalog-drawer input,
body.catalog-drawer-open #managementCatalog form.catalog-drawer select,
body.catalog-drawer-open #managementCatalog form.catalog-drawer textarea{
  position:relative;
  z-index:2;
}

/* Mobile uses the same rule: full-screen drawer, no backdrop layer. */
@media (max-width:820px){
  body.catalog-drawer-open #managementCatalog form.catalog-drawer{
    z-index:3000!important;
  }
}
