/* Hide the whole multi-select column (header + body) but keep DOM for mass-action wiring */
th.data-grid-multicheck-cell,
td.data-grid-checkbox-cell {
  display: none !important;
}

/* Ensure row “Edit” action is visible (your theme hides the .mp-edit icon) */
.wk-row-action-icons .mp-edit {
  display: inline-block !important;
  cursor: pointer;
  min-width: 28px; min-height: 28px;
}
.wk-row-action-icons .mp-edit:before {
  content: 'Edit';
  font-size: 12px;
  line-height: 28px;
  padding: 0 8px;
}

/* Subtle premium-hover to aid scanning (common in modern admin tables) */
.admin__data-grid-wrap table.data-grid tbody tr.data-row {
  transition: background-color .12s ease-in-out;
}
.admin__data-grid-wrap table.data-grid tbody tr.data-row:hover {
  background-color: #fafafc;
}
/* ===== CaptainGreek — Seller products grid fixes (no hidden text) ===== */
:root {
    --cg-navy: #2D337F;
    --cg-gold: #B89B65;
    --cg-border: #E4E7EC;
    --cg-surface: #FFFFFF;
    --cg-hover: #F6F7FF;
  }
  
  /* 0) Hide the entire bulk-multicheck column (header + body) */
  .admin__data-grid-wrap th.data-grid-multicheck-cell,
  .admin__data-grid-wrap td.data-grid-checkbox-cell {
    display: none !important;
  }
  
  /* 1) Allow dropdowns to overflow the grid, and prep the actions cell */
  .admin__data-grid-wrap,
  .admin__data-grid-wrap .data-grid,
  .admin__data-grid-wrap .data-grid tbody {
    overflow: visible !important;
    position: relative;
  }
  .admin__data-grid-wrap td.data-grid-actions-cell {
    position: relative !important;
    width: auto !important;
    min-width: 120px !important;       /* room for “Select ▾” */
    text-align: left !important;
  }
  
  /* 2) Proper “Select” button — show the text and add a caret */
  .admin__data-grid-wrap .data-grid .action-select-wrap { position: relative !important; }
  .admin__data-grid-wrap .data-grid .action-select {
    position: relative !important;
    display: inline-block !important;
    padding: 6px 28px 6px 12px !important;  /* right padding for caret */
    line-height: 1.4 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--cg-navy) !important;
    background: var(--cg-surface) !important;
    border: 1px solid var(--cg-border) !important;
    border-radius: 10px !important;
    text-decoration: none !important;
  }
  .admin__data-grid-wrap .data-grid .action-select:hover,
  .admin__data-grid-wrap .data-grid .action-select._active {
    border-color: var(--cg-gold) !important;
    box-shadow: 0 0 0 3px rgba(184,155,101,.25) !important;
  }
  /* caret (don’t hide the label) */
  .admin__data-grid-wrap .data-grid .action-select::after {
    content: "▾";
    position: absolute;
    right: 10px; top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: var(--cg-navy);
    pointer-events: none;
  }
  /* make sure any previous “hide text” rules are neutralized */
  .admin__data-grid-wrap .data-grid .action-select::before { content: none !important; }
  
  /* 3) Anchor the dropdown directly under the button */
  .admin__data-grid-wrap .data-grid .action-select-wrap > .action-menu {
    position: absolute !important;
    left: 0 !important;                /* align to button’s left edge */
    right: auto !important;
    top: calc(100% + 6px) !important;
    z-index: 100500 !important;        /* above the left slide menu */
    display: none;
    min-width: 180px !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    background: #fff !important;
    border: 1px solid var(--cg-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 24px rgba(16,24,40,.14), 0 2px 6px rgba(16,24,40,.06) !important;
    text-align: left !important;
    list-style: none !important;
  }
  .admin__data-grid-wrap .data-grid .action-select-wrap > .action-menu._active {
    display: block !important;
  }
  /* menu items — force visible text */
  .admin__data-grid-wrap .data-grid .action-select-wrap > .action-menu .action-menu-item {
    display: block !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    color: var(--cg-navy) !important;
    text-decoration: none !important;
  }
  .admin__data-grid-wrap .data-grid .action-select-wrap > .action-menu .action-menu-item:hover {
    background: var(--cg-hover) !important;
  }
  .admin__data-grid-wrap .data-grid .action-select-wrap > .action-menu
    .action-menu-item[data-action="item-delete"] {
    color: #B00020 !important;
  }
  
  /* 4) Light zebra + hover to feel premium */
  .admin__data-grid-wrap thead th .data-grid-cell-content {
    color: var(--cg-navy);
    font-weight: 800;
    letter-spacing: .02em;
  }
  .admin__data-grid-wrap .data-grid tr.data-row._odd-row td { background: #FAFBFF; }
  .admin__data-grid-wrap .data-grid tr.data-row:hover td { background: #F4F5FF; }
  
  .wk-card > a:hover {
   
    background: #fff !important; }   
    /* Scope to the related-products listing (either custom class or component scope) */
.mp-related-grid .data-grid,
[data-bind*="marketplace_related_product_listing.marketplace_related_product_listing"] .data-grid {
  /* Row hover */
}
.mp-related-grid .data-grid tr.data-row:hover,
[data-bind*="marketplace_related_product_listing.marketplace_related_product_listing"] .data-grid tr.data-row:hover {
  background: #faf7ff;
}

/* Visually hide the checkbox but keep it in the DOM for KO */
.mp-related-grid .data-grid-checkbox-cell-inner .admin__control-checkbox,
[data-bind*="marketplace_related_product_listing.marketplace_related_product_listing"] .data-grid-checkbox-cell-inner .admin__control-checkbox {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  clip: rect(0 0 0 0);
}

/* Selected state */
.mp-related-grid tr.data-row.is-selected,
[data-bind*="marketplace_related_product_listing.marketplace_related_product_listing"] tr.data-row.is-selected {
  background: #f3f0ff;
  outline: 2px solid #4f46e5;
  outline-offset: -2px;
}

/* Badge over thumbnail when selected (nice affordance) */
.mp-related-grid tr.data-row.is-selected .data-grid-thumbnail-cell .thumbnail-wrapper::after,
[data-bind*="marketplace_related_product_listing.marketplace_related_product_listing"] tr.data-row.is-selected .data-grid-thumbnail-cell .thumbnail-wrapper::after {
  content: 'Selected';
  position: absolute;
  top: 6px;
  left: 6px;
  padding: 2px 6px;
  font-size: 10px;
  line-height: 1;
  border-radius: 999px;
  background: #4f46e5;
  color: #fff;
}
/* Upsell & Cross-sell grids use the same visuals */
.mp-upsell-grid tr.data-row:hover,
.mp-crosssell-grid tr.data-row:hover,
[data-bind*="marketplace_upsell_product_listing.marketplace_upsell_product_listing"] tr.data-row:hover,
[data-bind*="marketplace_crosssell_product_listing.marketplace_crosssell_product_listing"] tr.data-row:hover {
  background: #faf7ff;
}

.mp-upsell-grid tr.data-row.is-selected,
.mp-crosssell-grid tr.data-row.is-selected,
[data-bind*="marketplace_upsell_product_listing.marketplace_upsell_product_listing"] tr.data-row.is-selected,
[data-bind*="marketplace_crosssell_product_listing.marketplace_crosssell_product_listing"] tr.data-row.is-selected {
  background: #f3f0ff;
  outline: 2px solid #4f46e5;
  outline-offset: -2px;
}

.mp-upsell-grid tr.data-row.is-selected .data-grid-thumbnail-cell .thumbnail-wrapper::after,
.mp-crosssell-grid tr.data-row.is-selected .data-grid-thumbnail-cell .thumbnail-wrapper::after,
[data-bind*="marketplace_upsell_product_listing.marketplace_upsell_product_listing"] tr.data-row.is-selected .data-grid-thumbnail-cell .thumbnail-wrapper::after,
[data-bind*="marketplace_crosssell_product_listing.marketplace_crosssell_product_listing"] tr.data-row.is-selected .data-grid-thumbnail-cell .thumbnail-wrapper::after {
  content: 'Selected';
  position: absolute;
  top: 6px;
  left: 6px;
  padding: 2px 6px;
  font-size: 10px;
  line-height: 1;
  border-radius: 999px;
  background: #4f46e5;
  color: #fff;
}
/* CaptainGreek — Pick button styling (scoped to grids) */
.admin__data-grid-wrap .wk-pick-btn{
    /* brand tokens (safe fallbacks) */
    --cg-blue:  #2d337f;
    --cg-gold:  #b89b65;
    --cg-line:  #dfe2ed;
  
    display:inline-flex; align-items:center; gap:8px;
    padding:8px 12px;
    min-height:32px;
    border:1px solid var(--cg-line);
    border-radius:9999px;
    background:#fff;
    color:var(--cg-blue);
    font:700 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
    text-decoration:none; cursor:pointer; user-select:none;
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease, transform .06s ease;
    box-shadow:0 1px 0 rgba(13,35,70,.06) inset;
  }
  
  /* icon “slot” before the label */
  .admin__data-grid-wrap .wk-pick-btn::before{
    content:""; display:inline-grid; place-items:center;
    width:18px; height:18px; border-radius:50%;
    border:2px solid var(--cg-line);
    font:900 12px/1 system-ui;
    transition: all .16s ease;
  }
  
  /* hover/focus */
  .admin__data-grid-wrap .wk-pick-btn:hover{
    border-color:#cfd5f7;
    box-shadow:0 6px 14px rgba(45,51,127,.10);
    transform:translateY(-1px);
  }
  .admin__data-grid-wrap .wk-pick-btn:focus-visible{
    outline:3px solid rgba(45,51,127,.28);
    outline-offset:2px;
  }
  
  /* SELECTED state */
  .admin__data-grid-wrap .wk-pick-btn.is-picked{
    background:linear-gradient(90deg, var(--cg-gold), #d4af37);
    border-color:var(--cg-gold);
    color:#1a1d2f;               /* readable on gold */
    box-shadow:0 8px 18px -8px rgba(184,155,101,.28);
  }
  
  /* checkmark when selected */
  .admin__data-grid-wrap .wk-pick-btn.is-picked::before{
    content:"\2713";             /* ✓ */
    color:#1a1d2f;
    border-color:transparent;
    background:rgba(255,255,255,.85);
    box-shadow:0 1px 2px rgba(0,0,0,.08);
  }
  
  /* optional: subtle hint on hover for non-picked */
  .admin__data-grid-wrap .wk-pick-btn:not(.is-picked):hover::before{
    border-color:#bfc7ef;
  }