/* Rares & Craft (mu-plugins/sg-special): the filter panel and item rows inside the D2R hub.
   Ported from the approved mockup (layout A). Uses the theme's tokens only; loads after d2r.css. */
.sg-si [hidden]{display:none!important}
/* Filter panel at the top of the list column */
.sg-si{display:flex;flex-direction:column;gap:14px;min-width:0}
.sg-si-filters{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:16px;display:flex;flex-direction:column;gap:14px;min-width:0}
.sg-si-label{display:block;font-family:var(--font-display);font-weight:700;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--heading-accent);margin:0 0 6px}
.sg-si-combo{position:relative;min-width:0}
.sg-si-input{display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:9px;background:var(--input-bg);padding:0 12px;color:var(--muted2)}
.sg-si-input:focus-within{border-color:var(--gold-light);box-shadow:0 0 0 3px rgba(249,115,22,.15)}
.sg-si-input input{flex:1;min-width:0;border:0;background:none;outline:none;color:var(--text);font:400 .92rem var(--font-body);padding:10px 0}
.sg-si-input input::placeholder{color:var(--muted2)}
.sg-si-suggest{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 4px);margin:0;padding:6px;background:var(--card);border:1px solid var(--border);border-radius:10px;box-shadow:var(--card-shadow-hover);max-height:300px;overflow-y:auto}
.sg-si-suggest li{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:7px 9px;border-radius:7px;cursor:pointer;font-size:.88rem}
.sg-si-suggest li small{display:block;color:var(--muted2);font-size:.72rem}
.sg-si-suggest li .n{flex:none;color:var(--muted2);font-size:.75rem;font-variant-numeric:tabular-nums}
.sg-si-suggest li[aria-selected="true"],.sg-si-suggest li:hover{background:var(--opt-pill-sel-bg)}
.sg-si-suggest li.is-none{cursor:default;color:var(--muted)}
.sg-si-pins{display:flex;flex-wrap:wrap;gap:8px}
.sg-si-pins:empty{display:none}
.sg-si-pin{display:inline-flex;align-items:center;gap:8px;max-width:100%;background:var(--opt-pill-sel-bg);border:1px solid var(--opt-sel-border);border-radius:999px;padding:4px 4px 4px 12px;font-size:.84rem;font-weight:600}
.sg-si-pin span{overflow-wrap:anywhere}
.sg-si-pin label{display:inline-flex;align-items:center;gap:4px;color:var(--muted);font-weight:500;font-size:.78rem}
.sg-si-pin input{width:54px;border:1px solid var(--border);border-radius:6px;background:var(--input-bg);color:var(--text);font:600 .84rem var(--font-body);padding:3px 6px}
.sg-si-pin button,.sg-si-x{flex:none;width:26px;height:26px;border-radius:50%;border:0;background:none;color:var(--muted);font-size:1rem;line-height:1;cursor:pointer}
.sg-si-pin button:hover{background:var(--surface2);color:var(--text)}
.sg-si-groups{display:flex;flex-wrap:wrap;gap:14px 26px}
.sg-si-group{min-width:0}
.sg-si-chips{display:flex;flex-wrap:wrap;gap:6px}
.sg-si-chip{display:inline-flex;align-items:baseline;gap:6px;border:1px solid var(--opt-border);background:var(--opt-bg);color:var(--text);border-radius:999px;padding:6px 13px;font:600 .84rem var(--font-body);cursor:pointer;transition:border-color .15s}
.sg-si-chip .n{font-size:.72rem;color:var(--muted2);font-variant-numeric:tabular-nums}
.sg-si-chip:hover{border-color:var(--opt-hover)}
.sg-si-chip[aria-pressed="true"]{background:var(--opt-sel-bg);border-color:var(--gold-light);box-shadow:inset 0 0 0 1px var(--gold-light);color:var(--gold)}
.sg-si-chip[aria-pressed="true"] .n{color:var(--gold)}
.sg-si-chip.is-zero:not([aria-pressed="true"]){opacity:.45}
.sg-si-adv-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;border-top:1px solid var(--border);padding:12px 0 0;color:var(--text);font:700 .95rem var(--font-display);letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.sg-si-adv-toggle .sg-d2r-caretd svg{transition:transform .15s}
.sg-si-adv-toggle[aria-expanded="true"] .sg-d2r-caretd svg{transform:rotate(180deg)}
.sg-si-adv{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 22px}
.sg-si-select,.sg-si-num{width:100%;min-width:0;border:1px solid var(--border);border-radius:8px;background:var(--input-bg);color:var(--text);font:400 .88rem var(--font-body);padding:8px 10px}
.sg-si-pair{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.sg-si-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:.88rem}
.sg-si-bar strong{color:var(--text)}
.sg-si-bar label{display:inline-flex;align-items:center;gap:8px}
.sg-si-bar .sg-si-select{width:auto}
.sg-si-clear{background:none;border:0;padding:0;color:var(--gold);font:700 .84rem var(--font-body);text-decoration:underline;cursor:pointer}
.sg-si-empty{text-align:center;color:var(--muted);padding:40px 20px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius)}
.sg-si-empty b{color:var(--text)}

/* Item row: the D2R row, with ItemGG's tooltip where the product image sits */
.sg-d2r-row.sg-si-row{grid-template-columns:286px minmax(0,1fr) 208px}
.sg-si-tt{background:#080c13;color:#fff;text-align:center;padding:16px 12px 18px;border:1px solid #2c3442;border-radius:8px;
  font-family:"Liberation Sans",Arial,Helvetica,sans-serif;font-size:13px;line-height:1.55;letter-spacing:.04em;min-width:0}
.sg-si-tt div{overflow-wrap:anywhere}
.sg-si-tt .t-name{font-family:var(--font-display);font-weight:700;font-size:21px;line-height:1.1;letter-spacing:.1em;text-transform:uppercase}
.sg-si-tt .t-base{font-family:var(--font-display);font-weight:500;font-size:14px;line-height:1.2;letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px}
.sg-si-tt .rare{color:#FFFF64}.sg-si-tt .crafted{color:#FFA500}.sg-si-tt .magic{color:#6B7CFF}.sg-si-tt .base,.sg-si-tt .req{color:#fff}
.sg-si-tt .hit{background:rgba(249,115,22,.22);box-shadow:inset 2px 0 0 #f97316;border-radius:4px}
.sg-si-tags{display:flex;flex-wrap:wrap;gap:6px}
.sg-si-tag{font-size:.74rem;font-weight:600;border-radius:999px;padding:2px 9px;background:var(--surface2);color:var(--muted)}
.sg-si-tag.q-rare{background:rgba(202,160,0,.14);color:#7a5d00}
.sg-si-tag.q-crafted{background:rgba(249,115,22,.13);color:var(--gold)}
[data-theme="dark"] .sg-si-tag.q-rare{color:#f3d75a}

@media (max-width:1100px) and (min-width:901px){
  .sg-d2r-row.sg-si-row{grid-template-columns:250px minmax(0,1fr) 180px;gap:16px}
}
@media (max-width:900px){
  .sg-d2r-row.sg-si-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title price" "tt tt" "foot foot"}
  .sg-si-row .sg-si-tt{grid-area:tt}
  .sg-si-row .sg-si-tags{display:none}
}
@media (max-width:640px){
  .sg-si-filters{padding:14px}
  .sg-si-input input,.sg-si-select,.sg-si-num,.sg-si-pin input{font-size:16px}
}

.sg-si-suggest li.is-zero{opacity:.55}
.sg-si-achip{display:inline-flex;align-items:center;gap:6px;max-width:100%;border:1px solid var(--opt-sel-border);background:var(--opt-sel-bg);color:var(--text);border-radius:999px;padding:4px 8px 4px 12px;font:600 .82rem var(--font-body);cursor:pointer}
.sg-si-achip span{overflow-wrap:anywhere;text-align:left}
.sg-si-achip .n{color:var(--muted2);font-size:.74rem;font-weight:500}
.sg-si-achip:hover{border-color:var(--gold-light)}
.sg-si-tips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:12px}
.sg-si-intro{margin:0;color:var(--muted);font-size:.86rem;max-width:62ch}
.sg-si-suggest{list-style:none}

/* view only for now: the buy button's place */
.sg-si-row .sgs-add{width:100%}
.sg-si-row .sgs-add.sg-loading{opacity:.6;pointer-events:none} /* theme 1.9.208: an add waiting or sending (sgSendAdd) */
.sg-si-row .sgs-msg{margin:6px 0 0;font-size:.82rem;color:var(--danger,#b42318)}
.sg-si-row .sgs-soon{cursor:default;opacity:.6;pointer-events:none;width:100%;text-align:center}

/* Load more: the script's own button, and the plain no-JS link (not the theme's .sg-d2r-more, which d2r.js takes over) */
.sgs-more,.sgs-nojs-more{display:flex;justify-content:center;margin-top:4px}
.sgs-more-btn{min-width:200px}

/* "New" badge on the sidebar entry */
a.sg-d2r-cat[data-cat="rares-craft"] .sg-d2r-cat-name::after{content:"New";margin-left:8px;font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);border:1px solid var(--border-gold);border-radius:999px;padding:0 6px;vertical-align:2px}
@media (prefers-reduced-motion:reduce){.sg-si-chip,.sg-si-adv-toggle .sg-d2r-caretd svg{transition:none}}
