
/* JR Memory Table Freeze 2 Cols + Scroll (Mobile) */
@media (max-width: 768px){
  /* Target ONLY the memory table area */
  #bp-memory-form-wrapper .memory-entry .table-container{
    overflow: visible !important;
  }

  /* Scroll wrapper added by JS */
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll{
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
    width: 100% !important;
    max-width: 100% !important;
    padding-bottom: 8px; /* keeps scrollbar from overlapping content */
  }

  /* Ensure table can extend wider than viewport to scroll */
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target{
    width: max-content !important;
    min-width: 100% !important;
    border-collapse: collapse;
  }

  /* Sticky first two columns (header + body) */
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(1),
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target td:nth-child(1){
    position: sticky !important;
    left: 0 !important;
    z-index: 6;
    background: inherit;
  }

  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(2),
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target td:nth-child(2){
    position: sticky !important;
    left: var(--jr-col1, 40px) !important;
    z-index: 5;
    background: inherit;
  }

  /* Keep header above cells */
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th{
    z-index: 10;
  }
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(1){ z-index: 12; }
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(2){ z-index: 11; }

  /* Prevent text in sticky cols from being clipped */
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(1),
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target td:nth-child(1),
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(2),
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target td:nth-child(2){
    background-color: rgba(255,255,255,0.75) !important; /* subtle to avoid see-through */
    backdrop-filter: blur(2px);
  }

  /* Add a subtle divider after the frozen area */
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target th:nth-child(2),
  #bp-memory-form-wrapper .memory-entry .table-container .jr-mt-scroll > table.jr-mt-freeze2-target td:nth-child(2){
    box-shadow: 6px 0 8px rgba(0,0,0,0.06);
  }
}
