/* Trading interaction polish. Loads after the shared app theme. */
.trading-shell :where(button,a,input,select):focus-visible {
    outline:3px solid rgba(170,199,81,.42);
    outline-offset:2px;
}
.trade-nav__item,.trade-picker__item,.market-listing,.trade-selection__item {
    transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.trade-nav__item:hover { background:rgba(255,255,255,.62); transform:translateY(-1px); }
.trade-picker-toolbar {
    display:flex;
    margin-top:18px;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}
.trade-picker-search {
    position:relative;
    display:block;
    min-width:0;
    flex:1;
    margin:0;
}
.trade-picker-search > i {
    position:absolute;
    top:50%;
    left:13px;
    z-index:1;
    color:var(--app-muted);
    font-size:10px;
    transform:translateY(-50%);
    pointer-events:none;
}
.trade-picker-search input {
    width:100%;
    height:40px;
    padding:0 13px 0 36px!important;
    color:var(--app-ink);
    outline:0;
    background:#f4f1e8;
    border:1px solid transparent;
    border-radius:11px;
    font:700 10px "DM Sans",sans-serif;
}
.trade-picker-search input:focus { background:#fffdf8; border-color:#aac751; }
.trade-picker-search input::placeholder { color:#8e968f; font-weight:600; }
.trade-picker-toolbar__count {
    flex:0 0 auto;
    color:var(--app-muted);
    font-size:9px;
    font-weight:700;
}
.trade-picker-toolbar__count b { color:var(--app-ink); }
[data-trade-builder] > .trade-picker,.trade-picker-column .trade-picker { margin-top:8px; }
.trade-picker__item:not([hidden]):hover { box-shadow:0 7px 16px rgba(16,43,34,.07); transform:translateY(-1px); }
.trade-picker__item.is-selected { box-shadow:inset 3px 0 0 #a8c438; }
.trade-picker__item.is-selected i { transform:scale(1.05); }
.trade-picker-empty {
    margin:-3px 0 12px;
    padding:15px;
    color:var(--app-muted);
    background:#f7f5ee;
    border-radius:11px;
    font-size:10px;
    text-align:center;
}
.trade-selection__summary { display:flex; align-items:center; gap:9px; }
.trade-selection__summary button {
    padding:0;
    color:#a95848;
    background:transparent;
    border:0;
    border-bottom:1px solid rgba(169,88,72,.32);
    font:800 8px "DM Sans",sans-serif;
    cursor:pointer;
}
.trade-selection__progress {
    height:4px;
    margin-top:10px;
    overflow:hidden;
    background:#e7e6dd;
    border-radius:20px;
}
.trade-selection__progress span {
    display:block;
    width:0;
    height:100%;
    background:linear-gradient(90deg,#aac751,var(--app-lime));
    border-radius:inherit;
    transition:width .2s ease;
}
.trade-selection__feedback {
    margin:9px 0 0;
    color:#a95848;
    font-size:9px;
    font-weight:800;
}
.trade-selection__item:hover { box-shadow:0 5px 12px rgba(16,43,34,.06); }
.trade-submit:disabled { opacity:.48; filter:saturate(.45); cursor:not-allowed; }
.trade-submit.is-loading { cursor:progress; }
.market-listing:hover { border-color:rgba(121,151,48,.36); box-shadow:0 14px 32px rgba(16,43,34,.07); transform:translateY(-2px); }
.market-listings > .trade-empty-list { grid-column:1 / -1; width:100%; }
.market-results-meta { display:flex; align-items:center; gap:11px; }
.market-results-meta > span { color:var(--app-muted); font-size:10px; font-weight:800; }
.market-results-meta > a {
    display:inline-flex;
    padding:6px 9px;
    align-items:center;
    gap:5px;
    color:#a95848!important;
    background:#fff0ea;
    border-radius:30px;
    font-size:8px;
    font-weight:800;
    text-decoration:none!important;
}
.market-combobox__control > i {
    position:absolute;
    top:50%;
    left:12px;
    z-index:1;
    color:var(--app-muted);
    font-size:9px;
    transform:translateY(-50%);
    pointer-events:none;
}
.market-combobox__control > i + input { padding-left:34px!important; }
.market-combobox__options button:first-child { margin-bottom:4px; border-bottom:1px solid var(--app-border); }
.market-combobox__options button[aria-selected="true"]::after { content:"\2713"; float:right; color:#6b891e; }

@media (max-width:980px) {
    .trade-layout { grid-template-columns:1fr; }
    .trade-help-card { display:none; }
    .trade-pokemon-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .market-toolbar { align-items:flex-start; flex-direction:column; }
    .market-toolbar form { width:100%; }
    .offer-builder__grid { grid-template-columns:1fr; }
    .offer-builder .trade-picker { max-height:280px; }
}
@media (max-width:700px) {
    .trading-shell { padding-bottom:55px; }
    .trading-hero,.offer-hero { min-height:0; padding:27px 22px; align-items:flex-start; flex-direction:column; gap:20px; }
    .trading-hero h1,.offer-hero h1 { font-size:36px; }
    .trading-hero__trust,.trading-hero__stat,.offer-hero__trainer { width:100%; }
    .trade-nav { margin:12px 0; }
    .trade-nav__item { min-width:138px; flex:0 0 auto; }
    .trade-panel--builder,.offer-builder,.offer-trade-summary,.market-toolbar,.trade-listing,.market-listing,.sent-offer { padding:17px; }
    .trade-picker,.trade-selection__items,.trade-pokemon-grid,.market-listings,.trade-pokemon-grid--offer { grid-template-columns:1fr; }
    .trade-listing__header,.sent-offer > header { align-items:flex-start; flex-direction:column; }
    .received-offer__actions { flex-direction:column; }
    .market-toolbar form { grid-template-columns:1fr; }
    .market-toolbar .feature-button { width:100%; }
    .sent-offer__sides { grid-template-columns:1fr; }
    .sent-offer__exchange { justify-self:center; transform:rotate(90deg); }
    .sent-offer__sides .trade-pokemon-grid { grid-template-columns:1fr; }
    .trade-section__header { align-items:flex-start; }
    .market-results-meta { align-items:flex-end; flex-direction:column-reverse; gap:5px; }
}

/* Marketplace filters */
.market-toolbar form { grid-template-columns:minmax(240px,1.15fr) minmax(180px,.85fr) auto; align-items:end; }
.market-toolbar > form > .feature-button { align-self:end; height:40px; min-height:40px; padding:0 17px; }
.market-combobox { position:relative; display:flex; min-width:0; flex-direction:column; gap:4px; }
.market-combobox > label { color:var(--app-muted); font-size:8px; font-weight:800; text-transform:uppercase; }
.market-combobox__control { position:relative; }
.market-combobox__control input { width:100%; height:40px; padding:0 35px 0 11px; color:var(--app-ink); outline:0; background:#f4f1e8; border:1px solid transparent; border-radius:10px; font:700 10px "DM Sans",sans-serif; }
.market-combobox__control input:focus { background:#fffdf8; border-color:#aac751; }
.market-combobox__control button { position:absolute; right:0; top:0; display:grid; width:34px; height:40px; place-items:center; color:var(--app-muted); background:transparent; border:0; cursor:pointer; }
.market-combobox__control button:hover { color:var(--app-ink); }
.market-combobox__options { position:absolute; z-index:20; top:calc(100% + 5px); right:0; left:0; max-height:220px; padding:5px; overflow:auto; background:var(--app-paper); border:1px solid var(--app-border); border-radius:12px; box-shadow:0 15px 34px rgba(16,43,34,.16); }
.market-combobox__options button { display:block; width:100%; min-height:31px; padding:0 9px; color:var(--app-ink); background:transparent; border:0; border-radius:7px; font:700 10px "DM Sans",sans-serif; text-align:left; cursor:pointer; }
.market-combobox__options button:hover,.market-combobox__options button[aria-selected="true"] { background:#edf4d6; }
@media (max-width:700px) { .market-toolbar form { grid-template-columns:1fr; }.market-toolbar > form > .feature-button { width:100%; } }

@media (max-width:480px) {
    .trade-picker-toolbar { align-items:stretch; flex-direction:column; }
    .trade-picker-toolbar__count { padding-left:2px; }
    .trade-selection > div:first-child { align-items:flex-start; }
    .trade-selection__summary { align-items:flex-end; flex-direction:column; gap:3px; }
}
@media (prefers-reduced-motion:reduce) {
    .trading-shell * { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; }
}
