/* Match the product metadata badges without reducing readable item text. */
.detail-topbar-meta .ean-tag,
.detail-topbar-meta .prod-datasheet-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 160px;
  height: 28px;
  min-height: 28px;
  padding: 4px 8px;
  margin-top: 0;
  border-width: 1px;
  border-style: solid;
  border-radius: 10px;
  font-family: var(--font);
  font-size: 12px !important;
  font-weight: 400;
  line-height: 18px !important;
  letter-spacing: 0;
  box-sizing: border-box;
}
.detail-topbar-meta .prod-datasheet-btn i svg {width:16px;height:16px;}

/* Give desktop category lists room independently of browser window height.
   The surrounding page can scroll; each category still scrolls independently. */
@media (min-width:641px) {
  .detail-body {
    height: max(1040px, calc(100dvh - 104px));
    min-height: 1040px;
  }
  .compat-scroll {min-height:640px;}
  .cat-col-body {min-height:480px;}
}

/* Remove redundant overall count and must-add indicator from the panel header. */
.compat-panel-header #compat-count,.compat-panel-header .must-add-pill{display:none!important}

/* Owner-requested wider workspace. The home page retains the SOP content limit. */
#product-detail {max-width:none;padding-left:24px;padding-right:24px;}
.detail-topbar {height:88px;gap:12px;padding-top:12px;padding-bottom:12px;}
.prod-thumb-wrap {width:64px;height:64px;}
.detail-topbar-title-row h1,.detail-topbar-title-row h2 {font-size:24px;line-height:32px;font-weight:600;}
.detail-topbar-meta {margin-top:4px;}
.category-scroll-hint {display:none;}
@media(min-width:641px) {
  .detail-body {height:max(1040px,calc(100dvh - 88px));}
  .panel-inbox {width:224px;min-width:224px;max-width:224px;}
  .compat-scroll {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:16px;}
  .cat-col {width:100%;min-width:0;max-width:none;}
  .cat-col:last-child {margin-right:0;}
}
/* Smaller screens wrap complete category columns rather than clipping them. */
@media(min-width:641px) and (max-width:1359px) {
  .detail-body {height:auto;overflow:visible;align-items:stretch;}
  .panel-inbox {height:auto;}
  .panel-compat {height:auto;overflow:visible;}
  .compat-scroll {grid-template-columns:repeat(3,minmax(0,1fr));height:auto;overflow:visible;flex:none;align-items:start;}
  .cat-col {height:640px;}
}
@media(min-width:641px) and (max-width:1100px) {
  .compat-scroll {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(min-width:641px) and (max-width:800px) {
  .detail-body {flex-direction:column;}
  .panel-inbox {width:100%;min-width:0;max-width:none;}
  .inbox-list {flex:none;overflow:visible;}
}
@media(max-width:640px) {
  #product-detail {padding-left:16px;padding-right:16px;}
  .detail-topbar {height:auto;min-height:88px;}
  .prod-thumb-wrap {width:56px;height:56px;}
  .detail-topbar-title-row h1,.detail-topbar-title-row h2 {font-size:20px;line-height:28px;}
}

/* The in-box card follows its contents; exports always follow the last row. */
.panel-inbox {height:auto;max-height:none;align-self:flex-start;}
.inbox-list {flex:none;height:auto;max-height:none;overflow:visible;}
.inbox-export-btns {margin-top:0;}
@media(min-width:641px) {
  .detail-body {height:auto;overflow:visible;}
}
@media(min-width:1360px) {
  .panel-compat {height:1040px;}
}


/* Required cards remain visible while optional items scroll underneath. */
.pinned-required-items{position:sticky;top:0;z-index:5;display:flex;flex-direction:column;gap:8px;flex-shrink:0;background:#f5f6f6;padding-bottom:8px;isolation:isolate}.pinned-required-items>.dep-pair{margin-bottom:0!important}.selectable-card{cursor:pointer}.selectable-card:focus-visible{outline:2px solid #0070d5;outline-offset:2px}.item-selection-disabled{cursor:default;border-color:#e4e6e6!important;background:#f5f6f6!important}.item-selection-disabled .item-cb{opacity:.4;cursor:not-allowed;filter:grayscale(1)}.item-selection-disabled .item-name{color:#5e6262}.item-selection-disabled .item-expand-btn,.item-selection-disabled .item-asset-btn{cursor:pointer}@media(max-width:640px){.pinned-required-items{position:static}}

