/* =========================================================
   N1 SKINS — UPGRADE DE INVENTÁRIO
   ========================================================= */

.upgrade-page-body{
  --ticker-h:0px;
}
.upgrade-page-body .upgrade-workspace,.upgrade-page-body .upgrade-start{font-size:14px}.upgrade-page-body .upgrade-column h2{font-size:24px}.upgrade-page-body .target-card h3,.upgrade-page-body .upgrade-inventory-card h3{font-size:14px}

.upgrade-page-body .payment-ticker{display:none}
.upgrade-page-body .site-header{top:0;padding:6px 18px}
.upgrade-page-body .header-shell{height:64px;min-height:64px;padding:6px 10px 6px 12px;border-radius:18px}
.upgrade-page-body .header-shell::before{border-radius:17px}
.upgrade-page-body .brand-logo-frame{width:52px;height:52px;border-radius:14px}
.upgrade-page-body .logo{width:46px;height:46px;border-radius:11px}
.upgrade-page-body .brand-info strong{font-size:15px}
.upgrade-page-body .brand-info small{margin-top:5px;font-size:9px}
.upgrade-page-body .main-nav a{height:38px;padding:0 12px;font-size:11px}
.upgrade-page-body .cart-btn{min-height:38px;padding:0 13px;font-size:12px}

.upgrade-page{
  width:100%;
  max-width:1480px;
  margin:0 auto;
  padding:12px 22px 44px;
  position:relative;
  z-index:1;
}

.eyebrow{
  margin:0;
  color:var(--accent);
  font-size:9px;
  font-weight:950;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.upgrade-intro,
.upgrade-start,
.upgrade-workspace{
  border:1px solid rgba(244,196,66,.22);
  border-radius:18px;
  background:rgba(9,7,5,.92);
  box-shadow:0 12px 30px rgba(0,0,0,.22);
}

.upgrade-intro{
  min-height:178px;
  padding:22px 24px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);
  gap:22px;
  align-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 20%,rgba(244,196,66,.12),transparent 13rem),
    linear-gradient(140deg,rgba(20,14,8,.97),rgba(6,6,5,.97));
}

.upgrade-intro h1{
  margin:6px 0 10px;
  max-width:700px;
  font-size:clamp(30px,4vw,56px);
  line-height:1;
  letter-spacing:-.045em;
  text-transform:uppercase;
}

.upgrade-intro h1 span{color:var(--accent)}
.upgrade-intro-copy>p:last-child{margin:0;max-width:740px;color:var(--muted);font-size:15px;line-height:1.55}

.upgrade-rules{display:grid;gap:8px}
.upgrade-rules>div{
  padding:11px 13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(255,255,255,.035);
}
.upgrade-rules strong{font-size:12px;color:#f5ead3}
.upgrade-rules span{font-size:11px;color:var(--muted);text-align:right}

.upgrade-start{
  margin-top:12px;
  padding:16px 18px;
  display:grid;
  grid-template-columns:minmax(250px,.62fr) minmax(500px,1.38fr);
  gap:20px;
  align-items:center;
}

.upgrade-start-copy h2{margin:2px 0 5px;font-size:clamp(20px,2.3vw,30px)}
.upgrade-start-copy p:last-child{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.trade-form label,.target-search-form label{display:block;margin-bottom:7px;font-size:11px;font-weight:850}
.trade-input-row,.target-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.trade-input-row input,.target-search-row input{
  width:100%;
  min-width:0;
  min-height:44px;
  padding:0 13px;
  border:1px solid rgba(244,196,66,.26);
  border-radius:11px;
  outline:none;
  background:#080705;
  color:var(--text);
}
.trade-input-row input:focus,.target-search-row input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(244,196,66,.08)}
.trade-input-row button,.target-search-row button{
  min-height:44px;
  padding:0 18px;
  border:1px solid rgba(244,196,66,.35);
  border-radius:11px;
  background:linear-gradient(135deg,var(--accent),var(--orange));
  color:#171006;
  font-weight:950;
  cursor:pointer;
  white-space:nowrap;
}
.trade-input-row button:disabled,.target-search-row button:disabled{opacity:.58;cursor:wait}
.trade-form small,.target-search-form small{display:block;margin-top:7px;color:var(--muted);font-size:10px;line-height:1.4}

.upgrade-status{
  grid-column:1/-1;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:rgba(255,255,255,.04);
  color:#d9d0b8;
  font-size:12px;
  line-height:1.45;
}
.upgrade-status.success{color:#8ff0b9;border-color:rgba(34,183,101,.28);background:rgba(34,183,101,.08)}
.upgrade-status.error{color:#ffadb5;border-color:rgba(255,77,94,.3);background:rgba(255,77,94,.08)}

.upgrade-workspace{margin-top:12px;padding:18px}
.upgrade-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:12px}
.upgrade-toolbar h2{margin:2px 0 4px;font-size:clamp(22px,2.4vw,32px)}
.upgrade-toolbar>div:first-child>p:last-child{margin:0;color:var(--muted);font-size:12px}

.mode-switch{display:flex;gap:8px}
.mode-option{
  min-width:155px;
  padding:10px 12px;
  display:flex;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  background:rgba(15,12,8,.94);
  cursor:pointer;
}
.mode-option input{position:absolute;opacity:0;pointer-events:none}
.mode-option strong,.mode-option small{display:block}
.mode-option strong{font-size:12px}
.mode-option small{margin-top:3px;color:var(--muted);font-size:9px}
.mode-option.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(244,196,66,.07)}
.mode-option[data-mode-card="post"].active{border-color:#59e3ff;box-shadow:0 0 0 2px rgba(0,212,255,.07)}

.upgrade-warnings{margin-bottom:12px;padding:11px 13px;border:1px solid rgba(255,176,32,.28);border-radius:11px;background:rgba(255,176,32,.07);color:#ffd897;font-size:12px;line-height:1.45}

.upgrade-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.upgrade-column{min-width:0;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(8,7,5,.72);overflow:hidden}
.column-heading{min-height:72px;padding:13px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(255,255,255,.07)}
.column-heading>div:first-child{display:flex;align-items:center;gap:10px;min-width:0}
.column-heading h2{margin:2px 0 0;font-size:20px}
.step-number{flex:0 0 30px;width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:rgba(244,196,66,.12);color:var(--accent);font-weight:950}
.selection-actions{display:flex;gap:7px}
.selection-actions button{
  min-height:34px;
  padding:0 10px;
  border:1px solid rgba(244,196,66,.24);
  border-radius:9px;
  background:#14100a;
  color:var(--text);
  font-size:10px;
  font-weight:850;
  cursor:pointer;
}
.selection-actions button:hover{border-color:var(--accent)}

.upgrade-inventory-grid{
  max-height:620px;
  padding:10px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  overflow:auto;
}

.upgrade-inventory-card{
  position:relative;
  min-width:0;
  min-height:116px;
  padding:10px 10px 10px 112px;
  border:1px solid rgba(244,196,66,.15);
  border-radius:13px;
  background:linear-gradient(180deg,rgba(17,14,10,.98),rgba(8,7,5,.98));
  transition:.16s;
}
.upgrade-inventory-card.selected{border-color:rgba(244,196,66,.58);box-shadow:0 0 0 2px rgba(244,196,66,.055)}
.upgrade-inventory-card.unpriced{border-style:dashed}
.upgrade-inventory-check{position:absolute;top:8px;right:8px;z-index:2;width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.17)}
.upgrade-inventory-check input{width:15px;height:15px;accent-color:var(--accent)}
.upgrade-inventory-image{position:absolute;left:8px;top:8px;width:96px;height:98px;display:grid;place-items:center;border-radius:10px;background:radial-gradient(circle,rgba(244,196,66,.08),transparent 66%)}
.upgrade-inventory-image img{display:block;width:auto;height:auto;max-width:90px;max-height:86px;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(0,0,0,.44))}
.upgrade-inventory-body{min-width:0;padding-right:23px}
.upgrade-inventory-body h3{margin:0 0 7px;font-size:12px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.upgrade-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:7px}
.upgrade-tags span{padding:3px 5px;border-radius:999px;background:rgba(255,255,255,.05);color:#d8ccb0;font-size:8px;font-weight:800}
.upgrade-value-row{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted)}
.upgrade-value-row strong{color:var(--accent);font-size:13px;text-align:right}
.post-selected .upgrade-value-row strong{color:#59e3ff}
.upgrade-item-source{margin-top:5px;color:var(--muted);font-size:8px}
.upgrade-manual{color:#ffc879;font-size:10px;font-weight:850;line-height:1.4}

.receive-column{padding-bottom:10px}
.target-search-form{padding:12px 14px 8px}
.target-status{margin:0 14px 8px;padding:9px 11px;border-radius:9px;background:rgba(255,255,255,.035);color:var(--muted);font-size:11px;text-align:center}
.target-status.error{color:#ffadb5;border:1px solid rgba(255,77,94,.24);background:rgba(255,77,94,.06)}
.target-results{padding:0 10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.target-card{min-width:0;padding:9px;border:1px solid rgba(244,196,66,.14);border-radius:12px;background:linear-gradient(180deg,rgba(17,14,10,.98),rgba(8,7,5,.98))}
.target-card-image{height:100px;display:grid;place-items:center;border-radius:9px;background:radial-gradient(circle,rgba(244,196,66,.07),transparent 65%)}
.target-card-image img{display:block;width:auto;height:auto;max-width:94%;max-height:88px;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(0,0,0,.4))}
.target-card h3{margin:8px 0 6px;min-height:32px;font-size:11px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.target-meta{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:7px}
.target-meta span{padding:3px 5px;border-radius:999px;background:rgba(255,255,255,.05);color:#d8ccb0;font-size:8px}
.target-card-price{display:flex;align-items:end;justify-content:space-between;gap:8px;margin-top:8px}
.target-card-price>div span,.target-card-price>div small{display:block}
.target-card-price>div span{color:var(--muted);font-size:8px}
.target-card-price>div strong{display:block;margin-top:2px;color:var(--accent);font-size:14px}
.target-card-price>div small{margin-top:2px;color:var(--muted);font-size:7px}
.target-add-btn{min-height:32px;padding:0 9px;border:0;border-radius:9px;background:linear-gradient(135deg,var(--accent),var(--orange));color:#171006;font-size:9px;font-weight:950;cursor:pointer}
.target-card.unpriced .target-add-btn{border:1px solid rgba(255,176,32,.28);background:#171109;color:#ffc879}
.load-more-targets{display:block;margin:10px auto 0;min-height:36px;padding:0 15px;border:1px solid rgba(244,196,66,.24);border-radius:10px;background:#14100a;color:var(--text);font-size:10px;font-weight:850;cursor:pointer}

.chosen-targets-wrap{margin:12px 10px 0;padding-top:11px;border-top:1px solid rgba(255,255,255,.07)}
.chosen-targets-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.chosen-targets-heading h3{margin:0;font-size:14px}
.chosen-targets-heading span{color:var(--muted);font-size:10px}
.chosen-targets{display:grid;gap:7px}
.chosen-targets-top{margin:12px 0 0;padding:13px 15px;border:1px solid rgba(244,196,66,.2);border-radius:15px;background:rgba(255,255,255,.025)}.chosen-targets-top .chosen-targets{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));max-height:240px;overflow:auto}
.empty-chosen{padding:18px;border:1px dashed rgba(244,196,66,.2);border-radius:11px;color:var(--muted);font-size:11px;text-align:center}
.chosen-target{
  min-width:0;
  padding:8px;
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  border:1px solid rgba(244,196,66,.14);
  border-radius:11px;
  background:rgba(255,255,255,.025);
}
.chosen-target-image{width:54px;height:50px;display:grid;place-items:center}
.chosen-target-image img{display:block;width:auto;height:auto;max-width:52px;max-height:46px;object-fit:contain}
.chosen-target-info{min-width:0}
.chosen-target-info strong{display:block;font-size:10px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chosen-target-info span{display:block;margin-top:4px;color:var(--accent);font-size:11px;font-weight:900}
.chosen-target-info small{display:block;margin-top:2px;color:var(--muted);font-size:8px}
.chosen-target-controls{display:flex;align-items:center;gap:5px}
.qty-btn,.remove-target-btn{width:26px;height:26px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#14110d;color:var(--text);font-weight:900;cursor:pointer}
.remove-target-btn{color:#ff9ca5;border-color:rgba(255,77,94,.2)}
.target-qty{min-width:18px;text-align:center;font-size:10px;font-weight:900}

.upgrade-summary{
  margin-top:12px;
  padding:13px 15px;
  display:grid;
  grid-template-columns:minmax(150px,.9fr) 24px minmax(150px,.9fr) minmax(230px,1.1fr) minmax(230px,1fr);
  gap:12px;
  align-items:center;
  border:1px solid rgba(244,196,66,.25);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(20,14,8,.98),rgba(7,7,6,.98));
  position:static;
  z-index:1;
  box-shadow:0 14px 38px rgba(0,0,0,.45);
}
.summary-block span,.summary-result span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.08em}
.summary-block strong,.summary-result strong{display:block;margin-top:3px;font-size:21px}
.summary-block small,.summary-result small{display:block;margin-top:3px;color:var(--muted);font-size:8px;line-height:1.35}
.summary-separator{font-size:23px;color:var(--muted);text-align:center}
.summary-result{padding:9px 11px;border-radius:11px;background:rgba(244,196,66,.07)}
.summary-result strong{color:var(--accent);font-size:24px}
.summary-result.credit strong{color:#7fe5aa}
.summary-actions{display:grid;gap:7px}
.finish-upgrade-btn,.copy-upgrade-btn{min-height:38px;border-radius:10px;font-size:10px;font-weight:950;cursor:pointer}
.finish-upgrade-btn{border:0;background:linear-gradient(135deg,#25d366,#0eaa4f);color:#04160b}
.copy-upgrade-btn{border:1px solid rgba(244,196,66,.24);background:#14100a;color:var(--text)}
.finish-upgrade-btn:disabled,.copy-upgrade-btn:disabled{opacity:.42;cursor:not-allowed}
.upgrade-footer{text-align:center;padding:24px;color:var(--muted);font-size:11px;border-top:1px solid rgba(244,196,66,.1)}

@media(max-width:1180px){
  .upgrade-columns{grid-template-columns:1fr}
  .upgrade-inventory-grid{max-height:480px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .target-results{grid-template-columns:repeat(3,minmax(0,1fr))}
  .upgrade-summary{grid-template-columns:1fr 20px 1fr 1.1fr;position:static}
  .summary-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}
}

@media(max-width:900px){
  .upgrade-intro{grid-template-columns:1fr}
  .upgrade-rules{grid-template-columns:repeat(3,minmax(0,1fr))}
  .upgrade-rules>div{display:block}
  .upgrade-rules span{display:block;margin-top:4px;text-align:left}
  .upgrade-start{grid-template-columns:1fr}
  .upgrade-toolbar{align-items:flex-start;flex-direction:column}
  .mode-switch{width:100%}
  .mode-option{flex:1;min-width:0}
  .upgrade-inventory-grid,.target-results{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:680px){
  .upgrade-page{padding:10px 12px 34px}
  .upgrade-header-actions{display:none}
  .upgrade-intro,.upgrade-start,.upgrade-workspace{border-radius:15px}
  .upgrade-intro{padding:18px 16px}
  .upgrade-intro h1{font-size:32px}
  .upgrade-rules{grid-template-columns:1fr}
  .upgrade-start{padding:15px}
  .trade-input-row,.target-search-row{grid-template-columns:1fr}
  .upgrade-workspace{padding:12px}
  .upgrade-toolbar h2{font-size:23px}
  .mode-switch{display:grid;grid-template-columns:1fr 1fr}
  .column-heading{align-items:flex-start;flex-direction:column}
  .selection-actions{width:100%}
  .selection-actions button{flex:1}
  .upgrade-inventory-grid,.target-results{grid-template-columns:1fr}
  .upgrade-inventory-grid{max-height:560px}
  .upgrade-summary{grid-template-columns:1fr 1fr;gap:9px}
  .summary-separator{display:none}
  .summary-result{grid-column:1/-1}
  .summary-actions{grid-template-columns:1fr}
  .chosen-target{grid-template-columns:48px minmax(0,1fr)}
  .chosen-target-controls{grid-column:1/-1;justify-content:flex-end}
}

/* Upgrade opera somente no modo pré-fixado. */
.upgrade-intro{grid-template-columns:1fr!important}
.upgrade-intro-copy{max-width:860px}
.upgrade-toolbar{grid-template-columns:1fr!important}
.mode-switch{display:none!important}


/* Confirmação discreta ao adicionar uma skin */
.target-status.success{
  color:#9ff0ba;
  border:1px solid rgba(37,211,102,.24);
  background:rgba(37,211,102,.07);
}
.upgrade-toast{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:120;
  max-width:min(390px,calc(100vw - 32px));
  padding:12px 16px;
  border:1px solid rgba(37,211,102,.36);
  border-radius:12px;
  background:rgba(7,28,16,.97);
  color:#b9f7cc;
  font-size:13px;
  font-weight:800;
  box-shadow:0 16px 44px rgba(0,0,0,.48);
  opacity:0;
  transform:translateY(12px);
  transition:opacity .2s ease,transform .2s ease;
  pointer-events:none;
}
.upgrade-toast.show{opacity:1;transform:translateY(0)}
@media(max-width:600px){.upgrade-toast{left:16px;right:16px;bottom:16px;max-width:none;text-align:center}}

/* =========================================================
   Ajuda para localizar o Trade Link da Steam
   ========================================================= */
.upgrade-intro .upgrade-trade-link-guide{
  position:relative;
  z-index:1;
  grid-column:1/-1;
  width:100%;
  margin-top:16px;
  padding-top:14px;
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  border-top:1px solid rgba(255,255,255,.07);
}

.upgrade-trade-link-guide__icon{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border:1px solid rgba(244,196,66,.25);
  border-radius:50%;
  background:rgba(244,196,66,.06);
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  line-height:1;
}

.upgrade-trade-link-guide__copy{
  min-width:0;
}

.upgrade-intro .upgrade-trade-link-guide__copy strong{
  display:block;
  margin:0 0 2px;
  color:rgba(248,244,233,.92);
  font-size:13px;
  line-height:1.35;
}

.upgrade-intro .upgrade-trade-link-guide__copy p{
  max-width:none;
  margin:0;
  color:rgba(190,185,173,.76);
  font-size:11.5px;
  line-height:1.48;
}

.upgrade-trade-link-guide__button{
  min-height:34px;
  padding:0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(244,196,66,.28);
  border-radius:9px;
  background:rgba(244,196,66,.07);
  color:var(--accent);
  font-size:10px;
  font-weight:900;
  letter-spacing:.03em;
  text-decoration:none;
  white-space:nowrap;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}

.upgrade-trade-link-guide__button:hover{
  border-color:rgba(244,196,66,.55);
  background:rgba(244,196,66,.11);
  transform:translateY(-1px);
}

.upgrade-trade-link-guide__button:focus-visible{
  outline:2px solid rgba(244,196,66,.75);
  outline-offset:3px;
}

@media(max-width:760px){
  .upgrade-intro .upgrade-trade-link-guide{
    grid-template-columns:22px minmax(0,1fr);
    gap:9px;
  }

  .upgrade-trade-link-guide__button{
    grid-column:2;
    width:max-content;
    max-width:100%;
    margin-top:2px;
  }
}

@media(max-width:480px){
  .upgrade-trade-link-guide__button{
    width:100%;
  }
}
