/* Front styles for Size Charts */
.sc-chart { display:grid; grid-template-columns: 1fr 1fr; gap:24px; align-items:start; }
.sc-chart__image { display:block; max-width:100%; height:auto; }
.sc-chart__legend { margin-top:12px; font-size:14px; color:#555; }
.sc-table { width:100%; border-collapse: collapse; font-size:15px; }
.sc-table th, .sc-table td { border:1px solid #eaeaea; padding:10px 12px; text-align:left; }
.sc-table thead th { background:#fafafa; }
.sc-table-wrap { overflow:auto; }

@media (max-width: 768px) {
  .sc-chart { grid-template-columns: 1fr; }
  .sc-table { border:0; }
  .sc-table thead { display:none; }
  .sc-table tr { display:block; border:1px solid #eee; margin-bottom:12px; }
  .sc-table td, .sc-table th[scope="row"] { display:flex; justify-content:space-between; border:0; border-bottom:1px solid #f3f3f3; }
  .sc-table td:last-child { border-bottom:0; }
  .sc-table td::before {
    content: attr(data-label);
    font-weight:600;
    margin-right:12px;
  }
}
