
.pss-wrap{
  max-width: 920px;
  margin: 0 auto;
  padding: 24px 16px 40px;
}
.pss-title{
  text-align:center;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: .04em;
  margin: 8px 0 18px;
}
/* テーマ側の見出し装飾（疑似要素）を無効化 */
.pss-title::before,
.pss-title::after{
  content: none !important;
  display: none !important;
}
.pss-search{
  width:min(760px, 100%);
  margin: 0 auto;
  display:flex;
  justify-content:center;
  align-items:center;
  gap: 10px;
}
.pss-input{
  flex: 1;
  width: auto;
  padding: 16px 18px;
  font-size: 18px;
  border: 2px solid #d8e2ff;
  border-radius: 14px;
  outline: none;
  box-shadow: 0 10px 30px rgba(0,0,0,.05);
}
.pss-input:focus{
  border-color:#86a7ff;
}
.pss-reset{
  appearance:none;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 14px;
  padding: 14px 16px;
  font-size: 14px;
  font-weight: 800;
  cursor:pointer;
  white-space:nowrap;
  box-shadow: 0 10px 30px rgba(0,0,0,.04);
}
.pss-reset:hover{
  border-color:#cbd5e1;
}
.pss-meta{
  width:min(760px, 100%);
  margin: 10px auto 0;
  color:#6b7280;
  font-size: 14px;
}
.pss-results{
  width:min(760px, 100%);
  margin: 10px auto 0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* 検索結果（チェック＋数量） */
.pss-row{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background:#fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.04);
}
.pss-check{
  display:flex;
  align-items:center;
  gap:6px;
}
.pss-select-text{
  display:none;
  font-size: 13px;
  font-weight: 800;
  color:#111827;
}
.pss-cb{
  width: 28px;
  height: 28px;
  cursor:pointer;
}
.pss-mid{
  flex: 1;
  min-width: 0;
}
.pss-name{
  display:block;
  font-size: 18px;
  font-weight: 700;
  color:#111827;
  line-height: 1.35;
  text-decoration:none;
}
.pss-name:hover{
  text-decoration:underline;
}
.pss-price{
  margin-top: 4px;
  font-size: 20px;
  font-weight: 800;
  color:#2563eb;
  white-space:nowrap;
}
.pss-qty{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.pss-qty-label{
  color:#2563eb;
  font-weight: 800;
}
.pss-qty-label-qty{ min-width: 2.5em; }
.pss-qty-unit{
  color:#2563eb;
  font-weight: 800;
}
.pss-qty-input{
  width: 66px;
  padding: 8px 10px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  font-size: 18px;
  text-align: right;
  outline: none;
}
.pss-qty-input-g{ width: 70px; }
.pss-qty-input:focus{
  border-color:#86a7ff;
}
.pss-empty, .pss-error{
  width:min(760px, 100%);
  margin: 14px auto 0;
  padding: 12px 14px;
  border-radius: 12px;
  background:#f8fafc;
  color:#475569;
  border:1px solid #e2e8f0;
}
.pss-error{
  background:#fff1f2;
  border-color:#fecdd3;
  color:#9f1239;
}
.pss-hint{
  width:min(760px, 100%);
  margin: 16px auto 0;
  font-size: 12px;
  color:#94a3b8;
}

/* 概算買取額 */
.pss-selected{
  width:min(760px, 100%);
  margin: 22px auto 0;
  padding-top: 16px;
  border-top: 2px solid #111827;
}
.pss-selected-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin: 0 0 10px;
}
.pss-actions{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-end;
  margin: 0 0 10px;
}

.pss-pdf-btn{
  appearance:none;
  border: 2px solid #111;
  background: #fff;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
}

.pss-pdf-btn:hover{ border-color:#cbd5e1; }
.pss-selected-title{
  font-size: 18px;
  font-weight: 900;
  margin: 0;
}
.pss-print-btn{
  appearance:none;
  border: 2px solid #111;
  background: #fff;
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
}

.pss-print-btn:hover{
  border-color:#cbd5e1;
}
.pss-selected-list{
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.pss-sel-row{
  display:flex;
  align-items:flex-end;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid #eef2f7;
}
.pss-sel-name{
  flex: 1;
  min-width: 0;
  color:#111827;
  text-decoration:none;
  font-weight: 700;
}
.pss-sel-name:hover{ text-decoration:underline; }
.pss-sel-unit{
  width: 120px;
  text-align:right;
  color:#2563eb;
  font-weight: 800;
  white-space:nowrap;
}
.pss-sel-qty{
  width: 110px;
  text-align:right;
  color:#2563eb;
  font-weight: 700;
  white-space:nowrap;
}
.pss-sel-subtotal{
  width: 130px;
  text-align:right;
  color:#2563eb;
  font-weight: 800;
  white-space:nowrap;
}
.pss-selected-total{
  display:flex;
  justify-content:flex-end;
  gap: 14px;
  margin-top: 10px;
  font-weight: 900;
  color:#2563eb;
}
.pss-total-label{
  letter-spacing: .06em;
}
.pss-total-amount{
  font-size: 22px;
}

/* =========================
   Mobile tweaks
   ========================= */
@media (max-width: 600px){
  /* --- search box layout: input full width, reset button full width under it --- */
  .pss-search{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .pss-input{
    width: 100%;
  }
  .pss-reset{
    width: 100%;
    padding: 14px 16px;
    border-radius: 999px;
  }

  /* --- result card layout (mobile) like the mock --- */
  .pss-row{
    display:grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    align-items:center;
    gap: 8px 10px;
  }
  .pss-check{
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    align-self: start;
  }
  .pss-mid{
    /* 商品名/価格は1行目で2列分を使い、右端まで使って折り返す */
    grid-column: 1 / 3;
    grid-row: 1 / 2;
  }
  .pss-qty{
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    align-self: center;
  }

  .pss-select-text{ display:inline; }

  /* 検索結果：商品名だけ少し小さく（価格はそのまま） */
  .pss-name{ font-size:16px; }

  /* 概算買取額：横幅不足で商品名が1文字ずつ縦になるのを防ぐ */
  .pss-sel-row{
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 6px 10px;
  }
  .pss-sel-name{
    flex-basis: 100%;
  }
  .pss-sel-unit,
  .pss-sel-qty,
  .pss-sel-subtotal{
    width: auto;
    min-width: 0;
    font-size: 14px;
  }
  .pss-selected-total{
    flex-wrap: wrap;
  }
}

@media (max-width: 600px){
  /* ■概算買取額の上段にボタン（PDF↓ / 印刷）を配置 */
  .pss-selected-head{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .pss-actions{ order: 0; width: 100%; margin: 0; }
  .pss-selected-title{ order: 1; }

  .pss-actions{
    justify-content: space-between;
  }
  .pss-pdf-btn, .pss-print-btn{
    width: 48%;
    text-align:center;
    padding: 12px 0;
  }
}
