/* v7.0.3 — comparison grid is an INSIDE-scroll area, never a page-wide overflow. */
@media (max-width: 991.98px) {
  .tvemui703-compare-scroll,
  .table-responsive:has(> .table-compare),
  .table-responsive:has(> table.compare-list),
  .yith-woocompare-table:has(table.compare-list),
  #yith-woocompare:has(table.compare-list) {
    display:block!important;
    position:relative;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
    scrollbar-width:thin;
    scroll-behavior:smooth;
    border:1px solid #e3e8e6;
    border-radius:14px;
    background:#fff;
    box-sizing:border-box;
  }
  .tvemui703-compare-scroll:focus-visible{outline:2px solid #418850;outline-offset:2px;}
  /* Product columns keep readable width; the wrapper, not the whole page, scrolls. */
  table.table-compare, table.compare-list {
    display:table!important;
    width:max-content!important;
    min-width:100%!important;
    max-width:none!important;
    table-layout:fixed!important;
    margin:0!important;
    border-collapse:separate!important;
    border-spacing:0;
    background:#fff;
  }
  table.table-compare tr,table.compare-list tr {display:table-row!important;}
  table.table-compare tr > :is(th,td),
  table.compare-list tr > :is(th,td) {
    box-sizing:border-box!important;
    display:table-cell!important;
    min-width:188px!important;
    width:188px!important;
    max-width:240px!important;
    padding:12px 11px!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
    vertical-align:middle;
    background:#fff;
    font-size:13px;
    line-height:1.4;
  }
  table.table-compare tr > th:first-child,
  table.compare-list tr > th:first-child,
  table.tvemui703-first-col-td tr > td:first-child {
    position:sticky!important;
    left:0!important;
    z-index:3!important;
    width:122px!important;
    min-width:122px!important;
    max-width:122px!important;
    background:#f7faf8!important;
    color:#263a30;
    box-shadow:3px 0 9px rgba(0,0,0,.06);
    text-align:left!important;
    font-weight:700;
  }
  table.table-compare tr > td:first-child:not(:last-child) {box-sizing:border-box;}
  table.compare-list tr:first-child > th,
  table.table-compare tr:first-child > th {z-index:4!important;}
  table.table-compare :is(img,.product-image img),
  table.compare-list :is(img,.product-image img) {
    max-width:100%!important;
    width:auto!important;
    height:auto!important;
    max-height:170px;
    object-fit:contain;
  }
  table.table-compare .product-title,
  table.compare-list .product-title {
    display:block!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
    line-height:1.35;
    font-size:13px;
  }
  table.table-compare .button,
  table.compare-list .button {
    display:inline-block!important;
    white-space:normal!important;
    width:auto!important;
    max-width:100%!important;
    padding:8px 11px!important;
    font-size:12px!important;
    line-height:1.3!important;
  }
  .tvemui703-compare-hint {
    font-size:12px;
    font-weight:600;
    padding:9px 12px;
    margin:0 0 8px;
    border-radius:10px;
    background:#edf5ed;
    color:#2e653b;
  }
  /* YITH classic compare colorbox; only when JS confirms compare iframe. */
  body.tvemui703-compare-open #colorbox,
  body.tvemui703-compare-open #cboxWrapper,
  body.tvemui703-compare-open #cboxContent,
  body.tvemui703-compare-open #cboxLoadedContent {
    max-width:calc(100vw - 12px)!important;
    box-sizing:border-box;
  }
  body.tvemui703-compare-open #cboxLoadedContent iframe {
    max-width:100%!important;
  }
}
@media (max-width:360px){
  table.table-compare tr > :is(th,td),table.compare-list tr > :is(th,td) {
    width:170px!important;min-width:170px!important;
  }
  table.table-compare tr > th:first-child,
  table.compare-list tr > th:first-child,
  table.tvemui703-first-col-td tr > td:first-child {
    width:105px!important;min-width:105px!important;max-width:105px!important;
  }
}
