/* Stooper HS Code Finder - front */
.stooper-hs-widget{
  border:1px solid #e5e7eb;
  border-radius:16px;
  padding:18px;
  background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,0.06);
  width:100%;
  max-width:none; /* allow full width */
}

.stooper-hs-head{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:12px;}
.stooper-hs-title h3{margin:0; font-size:20px;}
.stooper-hs-sub{color:#6b7280; font-size:13px; margin-top:2px;}
.stooper-hs-note{color:#6b7280; font-size:12px; align-self:center;}

.stooper-hs-controls{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:12px;}
.stooper-hs-search{display:flex; gap:8px; flex:1 1 520px;}
.stooper-hs-search input{flex:1; padding:12px 14px; border:1px solid #d1d5db; border-radius:12px; font-size:15px;}
.stooper-hs-btn{padding:10px 12px; border-radius:12px; border:1px solid #d1d5db; background:#f9fafb; cursor:pointer; font-size:14px;}
.stooper-hs-btn-primary{background:#111827; color:#fff; border-color:#111827;}
.stooper-hs-btn-ghost{background:#fff;}
.stooper-hs-advanced{flex:0 0 auto;}
.stooper-hs-adv-toggle{padding:10px 12px; border-radius:12px; border:1px solid #d1d5db; background:#fff; cursor:pointer;}

.stooper-hs-adv-panel{margin-top:8px; border:1px solid #e5e7eb; border-radius:12px; padding:12px; background:#fff;}
.stooper-hs-grid{display:grid; grid-template-columns:repeat(3, minmax(200px, 1fr)); gap:12px;}
.stooper-hs-grid .field{display:flex; flex-direction:column; gap:6px;}
.stooper-hs-grid label{font-size:12px; color:#374151;}
.stooper-hs-grid select{padding:9px 10px; border:1px solid #d1d5db; border-radius:10px; background:#fff; font-size:14px;}
.stooper-hs-grid input{padding:9px 10px; border:1px solid #d1d5db; border-radius:10px; background:#fff; font-size:14px;}
.stooper-hs-inline{display:flex; gap:10px; flex-wrap:wrap;}
.stooper-hs-inline .radio{font-size:14px; color:#111827;}
.field-wide{grid-column:1 / -1;}
.hint{color:#6b7280;}
.stooper-hs-actions-row{margin-top:10px; display:flex; justify-content:flex-end;}

.stooper-hs-results-meta{color:#374151; font-size:14px; margin:10px 0;}

.stooper-hs-table-wrap{overflow-x:auto;}
.stooper-hs-table{
  width:100%;
  min-width:1600px;
  border-collapse:collapse;
}
.stooper-hs-table th, .stooper-hs-table td{
  border-top:1px solid #e5e7eb;
  padding:12px 10px;
  vertical-align:top;
  font-size:14px;
}
.stooper-hs-table thead th{
  border-top:none;
  color:#374151;
  background:#f9fafb;
  font-weight:700;
  position:sticky;
  top:0;
  z-index:1;
}
.stooper-hs-table .muted{color:#6b7280; text-align:center;}
.stooper-hs-table .codewrap{display:flex; gap:6px; align-items:center;}
.stooper-hs-table .warn{color:#b45309;}
.stooper-hs-table .actions{text-align:right; white-space:nowrap;}
.stooper-hs-table .details{padding:7px 12px; border-radius:10px; border:1px solid #d1d5db; background:#fff; cursor:pointer; font-size:13px;}
.stooper-hs-table .mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;}

.details-box{
  background:#f9fafb;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:12px;
}
.ctx-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(220px, 1fr));
  gap:8px 14px;
  margin-bottom:12px;
}
.ctx-grid .ctx-wide{grid-column: 1 / -1;}
.wrap{white-space:pre-wrap;}

.ctx-siblings-title{font-weight:700; margin:8px 0 2px;}
.ctx-siblings-hint{color:#6b7280; font-size:12px; margin-bottom:8px;}
.ctx-siblings-wrap{overflow-x:auto;}
.ctx-table{
  width:100%;
  min-width:1100px;
  border-collapse:collapse;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
}
.ctx-table th, .ctx-table td{border-top:1px solid #e5e7eb; padding:10px 8px; font-size:13px; vertical-align:top;}
.ctx-table thead th{background:#f3f4f6; border-top:none; font-weight:700;}
.pick-code{
  padding:4px 8px;
  border-radius:10px;
  border:1px solid #d1d5db;
  background:#fff;
  cursor:pointer;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

@media (max-width: 900px){
  .stooper-hs-grid{grid-template-columns:1fr;}
  .stooper-hs-search{flex:1 1 100%;}
  .ctx-grid{grid-template-columns:1fr;}
  .stooper-hs-table{min-width:980px;}
}

.path-mini{margin-top:4px; color:#6b7280; font-size:12px; line-height:1.35; white-space:pre-wrap;}


/* highlight for matched terms */
.stooper-hs-mark{
  background: #fff3b0;
  padding: 0 3px;
  border-radius: 6px;
}
/* stronger highlight for the "best" matched column */
.hit-best .stooper-hs-mark{
  background: #ffe08a;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.12);
}

/* highlight toggle checkbox */
.stooper-hs-inline-toggle{margin-top:6px;}
.stooper-hs-inline-toggle .check{font-size:14px; color:#111827; display:inline-flex; gap:8px; align-items:center;}