/* =========================================================
   BCR FITMENT - CLEAN PACK
   Scope: only inside .bcr-fitment
   ========================================================= */

.bcr-fitment .fitment-top{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin:12px 0;
}

.bcr-fitment .fitment-search{
  padding:10px 12px;
  border:1px solid #111;
  border-radius:10px;
  min-width:260px;
  background:#fff;
}

.bcr-fitment .fitment-brands{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.bcr-fitment .fitment-brands button{
  padding:8px 10px;
  border:1px solid #111;
  background:#fff;
  border-radius:999px;
  cursor:pointer;
}

.bcr-fitment .fitment-brands button.is-active{
  background:#111;
  color:#fff;
}

.bcr-fitment .fitment-status{
  font-size:12px;
  margin:6px 0;
  opacity:.9;
}

/* scroll wrapper */
.bcr-fitment .fitment-wrap{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid #111;
  border-radius:10px;
  background:#fff;
}

/* table */
.bcr-fitment .fitment-table{
  width:100%;
  max-width:100%;
  min-width:1800px;          /* 必要に応じて調整 */
  border-collapse:separate;
  border-spacing:0;
  table-layout:auto;
  font-size:12px;
}

.bcr-fitment .fitment-table th,
.bcr-fitment .fitment-table td{
  box-sizing:border-box;
  padding:7px 8px;
  line-height:1.25;
  vertical-align:middle;
  white-space:nowrap;
  border-right:1px solid #111;
  border-bottom:1px solid #111;
}

.bcr-fitment .fitment-table tr > *:first-child{ border-left:1px solid #111; }
.bcr-fitment .fitment-table thead tr:first-child > *{ border-top:1px solid #111; }

/* header: black like your preferred design */
.bcr-fitment .fitment-table thead th{
  background:#111;
  color:#fff;
  font-weight:700;
  position:sticky;
  top:0;
  z-index:10;
  background-clip:padding-box;
  border-right:1px solid rgba(255,255,255,.18);
  border-bottom:1px solid rgba(255,255,255,.18);
  text-align:left; /* 中央なら center に */
}

.bcr-fitment .fitment-table thead th.grp,
.bcr-fitment .fitment-table thead th.tw{
  background:#111;
}

.bcr-fitment .fitment-table thead tr:nth-child(2) th{
  font-size:11px;
  opacity:.95;
}

.bcr-fitment .fitment-table tbody tr:nth-child(even) td{
  background:#fafafa;
}

/* note wraps */
.bcr-fitment .fitment-table td.note{
  white-space:normal;
  min-width:320px;
}

.bcr-fitment .fitment-table .sub{
  font-size:11px;
  opacity:.85;
}

/* mobile */
@media (max-width: 768px){
  .bcr-fitment .fitment-table{
    font-size:11px;
    min-width:1700px;
  }
  .bcr-fitment .fitment-table th,
  .bcr-fitment .fitment-table td{
    padding:6px 7px;
  }
}

/* ===== Fix: prevent alignfull clipping ONLY for fitment block ===== */
.bcr-fitment-wide{
  overflow-x: hidden;      /* alignfullの“はみ出し”をこのブロック内だけで抑止 */
}

.bcr-fitment-wide .swell-block-fullWide__inner{
  box-sizing: border-box;
  max-width: 100%;
  padding-left: 16px;
  padding-right: 16px;
}

/* 枠と表は常に内側に収める */
.bcr-fitment-wide .fitment-wrap{
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

.bcr-fitment-wide .fitment-table{
  max-width: 100%;
}

/* ===== FINAL FIX: border clipping on alignfull ===== */

/* このブロックだけ横方向のはみ出しを抑止 */
.bcr-fitment-wide{
  overflow-x: clip; /* hidden より “切り方” が安定 */
}

/* border は “切れやすい” ので、内側shadowに変更する */
.bcr-fitment-wide .fitment-wrap{
  border: 0 !important;
  box-shadow: 0 0 0 1px #111 inset; /* ←内側罫線で見切れない */
  border-radius: 10px;
  background: #fff;
}

/* 念のため */
.bcr-fitment-wide .fitment-table{
  max-width: 100%;
}