/* Minimal, responsive modal + table styles for the size chart */

.cwpsc-trigger {
  background: none;
  color: inherit;
  padding: 0;
  border: 0;
  text-decoration: underline;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 20px;
}

.cwpsc-no-scroll { overflow: hidden; }

/* Optional: when modal opens, bump main stacking context to avoid being under sticky headers */
.cwpsc-main-elevated { position: relative; z-index: 0; }

.cwpsc-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 999999; /* ensure above typical sticky headers */
}
.cwpsc-modal.is-open { display: flex; align-items: center; justify-content: center; }

.cwpsc-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 1;
}

.cwpsc-modal__dialog {
  position: relative;
  background: #fff;
  box-sizing: border-box;
  width: 100%;
  max-width: 1280px;
  margin: 5vh 2vw;
  border-radius: 8px;
  padding: 28px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
  z-index: 2;
}

.cwpsc-modal__close {
  position: absolute;
  right: 12px;
  top: 10px;
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
}

.cwpsc-table-wrapper { overflow: auto; max-height: 70vh; width: 100%; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y; cursor: grab; }
.cwpsc-table-wrapper.is-dragging { cursor: grabbing; }

.cwpsc-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.cwpsc-table th, .cwpsc-table td { border: 1px solid rgba(0,0,0,0.08); padding: 10px; text-align: center; }
.cwpsc-table thead th { background: rgba(0,0,0,0.04); font-weight: 600; color: rgba(0,0,0,0.85); }
.cwpsc-table th.cwpsc-row-label { text-align: left; background: rgba(0,0,0,0.02); font-weight: 600; color: rgba(0,0,0,0.85); }
.cwpsc-table tbody tr:nth-child(odd) td { background: rgba(0,0,0,0.015); }
.cwpsc-table tbody tr:nth-child(even) td { background: rgba(0,0,0,0.035); }
.cwpsc-table tbody tr:hover td { background: rgba(0,0,0,0.06); }

@media (max-width: 600px) {
  .cwpsc-modal__dialog {
    margin: 0;
    min-height: 100vh;
    width: 100%;
    max-width: none;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    justify-content: center; /* center content vertically on mobile */
  }
  .cwpsc-table-wrapper { max-height: calc(100vh - 120px); }
}


