/* Visual selector for choosing a work to publish to a creator store. */
.shop-native-work-select { display:none !important; }
.shop-work-picker { grid-column:1 / -1; padding:16px; border:1px solid #dfe2e8; border-radius:8px; background:#fafbfc; }
.shop-work-picker-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
.shop-work-picker-head strong { display:block; color:#25324a; font-size:15px; }
.shop-work-picker-head small { display:block; margin-top:4px; color:#738097; font-size:12px; }
.shop-work-picker-selected { padding:5px 9px; border:1px solid #ddd5fb; border-radius:999px; background:#f3f0ff; color:#5d42bc; font-size:12px; font-weight:800; }
.shop-work-picker-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:180px; gap:12px; }
.shop-work-picker-card { position:relative; display:grid; grid-column:auto !important; grid-template-columns:124px minmax(0,1fr); width:100%; height:100%; min-height:0; box-sizing:border-box; overflow:hidden; padding:0; border:1px solid #dfe3e9; border-radius:7px; background:#fff; color:#25324a; text-align:left; cursor:pointer; transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.shop-work-picker-card:hover { transform:translateY(-1px); border-color:#8d76e6; box-shadow:0 7px 16px rgba(54,42,100,.11); }
.shop-work-picker-card[aria-pressed="true"] { border-color:#694bd0; outline:1px solid #694bd0; outline-offset:0; background:#fbfaff; }
.shop-work-picker-media { position:relative; display:block; min-width:0; overflow:hidden; background:#26384d; }
.shop-work-picker-media img,.shop-work-picker-media video { display:block; width:100%; height:100%; object-fit:cover; }
.shop-picker-fallback-media { display:grid; width:100%; height:100%; place-items:center; background:#33465e; color:#fff; font-size:12px; font-weight:800; }
.shop-picker-media-type { position:absolute; top:7px; left:7px; padding:3px 6px; border-radius:4px; background:rgba(22,31,44,.78); color:#fff; font-size:10px; font-weight:800; }
.shop-work-picker-copy { display:grid; align-content:center; gap:6px; min-width:0; padding:12px 45px 12px 12px; }
.shop-work-picker-copy b { overflow:hidden; color:#26354e; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.shop-work-picker-copy small { color:#788399; font-size:12px; line-height:1.45; }
.shop-work-picker-check { position:absolute; right:9px; bottom:9px; padding:4px 6px; border:1px solid #d9dee6; border-radius:4px; background:#fff; color:#6c7789; font-size:11px; font-weight:800; }
.shop-work-picker-card[aria-pressed="true"] .shop-work-picker-check { border-color:#694bd0; background:#694bd0; color:#fff; }
.shop-work-picker-pagination { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:15px; }
.shop-work-picker-pagination button { min-width:72px; min-height:32px; border:1px solid #d7dce5; border-radius:6px; background:#fff; color:#34435b; font-size:12px; font-weight:800; }
.shop-work-picker-pagination button:disabled { opacity:.42; cursor:not-allowed; }
.shop-work-picker-pagination span { min-width:48px; color:#6d7890; font-size:12px; font-weight:800; text-align:center; }
@media (max-width:760px) {
  .shop-work-picker { padding:12px; }
  .shop-work-picker-head { align-items:flex-start; flex-direction:column; gap:7px; }
  .shop-work-picker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:150px; gap:8px; }
  .shop-work-picker-card { grid-template-columns:78px minmax(0,1fr); }
  .shop-work-picker-copy { gap:4px; padding:9px 38px 9px 8px; }
  .shop-work-picker-copy b { font-size:13px; }
  .shop-work-picker-copy small { font-size:11px; }
}
