/* CRC mobile UX audit layer: click-safe drawer and desktop-identical signature rendering. */
@media (max-width: 860px) {
  body.crc-mobile {
    --crc-mobile-sidebar-width: min(84vw, 312px);
  }

  body.crc-mobile .sidebar {
    z-index: 3200 !important;
    width: var(--crc-mobile-sidebar-width) !important;
    max-width: var(--crc-mobile-sidebar-width) !important;
    pointer-events: none !important;
    touch-action: pan-y !important;
  }

  body.crc-mobile-sidebar-open .sidebar,
  body.crc-mobile .sidebar.crc-mobile-sidebar-open {
    pointer-events: auto !important;
  }

  body.crc-mobile-sidebar-open .sidebar *,
  body.crc-mobile .sidebar.crc-mobile-sidebar-open * {
    pointer-events: auto !important;
  }

  body.crc-mobile .crc-mobile-sidebar-scrim {
    left: var(--crc-mobile-sidebar-width) !important;
    right: 0 !important;
    width: calc(100vw - var(--crc-mobile-sidebar-width)) !important;
    z-index: 3000 !important;
  }

  body.crc-mobile-sidebar-open .workspace {
    pointer-events: none !important;
  }

  body.crc-mobile-sidebar-open .crc-mobile-sidebar-scrim,
  body.crc-mobile-sidebar-open .crc-mobile-sidebar-toggle {
    pointer-events: auto !important;
  }

  body.crc-mobile .crc-mobile-sidebar-toggle {
    z-index: 3400 !important;
    touch-action: manipulation !important;
  }

  body.crc-mobile .compose-window .html-editor {
    overflow: auto !important;
    overflow-x: auto !important;
    overscroll-behavior: contain !important;
  }

  body.crc-mobile .compose-window .html-editor table[width="790"],
  body.crc-mobile .compose-window .html-editor .crcpro-light-wrap {
    display: table !important;
    width: 790px !important;
    min-width: 790px !important;
    max-width: 790px !important;
    table-layout: auto !important;
    transform: none !important;
    zoom: 1 !important;
  }

  body.crc-mobile .compose-window .html-editor table[width="790"] table,
  body.crc-mobile .compose-window .html-editor .crcpro-light-wrap table,
  body.crc-mobile .compose-window .html-editor .crcpro-light-stack {
    display: table !important;
    width: 100% !important;
    max-width: none !important;
    table-layout: auto !important;
  }

  body.crc-mobile .compose-window .html-editor table[width="790"] tbody,
  body.crc-mobile .compose-window .html-editor .crcpro-light-wrap tbody,
  body.crc-mobile .compose-window .html-editor .crcpro-light-stack > tbody {
    display: table-row-group !important;
  }

  body.crc-mobile .compose-window .html-editor table[width="790"] tr,
  body.crc-mobile .compose-window .html-editor .crcpro-light-wrap tr,
  body.crc-mobile .compose-window .html-editor .crcpro-light-stack > tbody > tr {
    display: table-row !important;
  }

  body.crc-mobile .compose-window .html-editor table[width="790"] td,
  body.crc-mobile .compose-window .html-editor .crcpro-light-wrap td,
  body.crc-mobile .compose-window .html-editor .crcpro-light-stack > tbody > tr > td {
    display: table-cell !important;
    max-width: none !important;
    box-sizing: content-box !important;
    float: none !important;
  }

  body.crc-mobile .compose-window .html-editor .crcpro-light-logo-cell {
    width: 126px !important;
    min-width: 126px !important;
    padding: 0 17px 0 0 !important;
  }

  body.crc-mobile .compose-window .html-editor .crcpro-light-brand-cell {
    width: 290px !important;
    min-width: 290px !important;
    padding: 0 18px 0 0 !important;
  }

  body.crc-mobile .compose-window .html-editor .crcpro-light-contact-cell {
    border-top: 0 !important;
    border-left: 1px solid #dfd4b9 !important;
    padding: 0 0 0 18px !important;
  }

  body.crc-mobile .compose-window .html-editor .crcpro-light-dept-cell {
    width: 146px !important;
    min-width: 146px !important;
  }

  body.crc-mobile .compose-window .html-editor .crcpro-light-spacer {
    width: 6px !important;
    min-width: 6px !important;
  }
}

@media (max-width: 380px) {
  body.crc-mobile {
    --crc-mobile-sidebar-width: min(88vw, 292px);
  }
}