/*
 * Paint Color Converter — the search, its suggestions, the popular colors and the twins. Source: sites/dreamy-tools/tools/
 * paint-color-converter/tool.css (Dash repo). ⚠️ Every input/select/button stays ≥ 16px (iPhone zooms the page on a smaller
 * field — fenced) and every tap target ≥ 44px.
 */
.pc-form[aria-busy="true"] .pc-pops { opacity: .6; }
.pc-sugg { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pc-s, .pc-pop {
  font: inherit; font-size: 16px; min-height: 44px; cursor: pointer; text-align: left; color: var(--chqt-ink);
  display: flex; align-items: center; gap: 10px; padding: 6px 12px 6px 6px; border-radius: 10px; border: 1px solid var(--chqt-line); background: #fff;
}
.pc-s { width: 100%; }
.pc-s i, .pc-pop i { flex: none; width: 30px; height: 30px; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); }
.pc-s:hover, .pc-pop:hover { border-color: var(--chqt-ink); }
.pc-pops { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-pop small { color: var(--chqt-muted); font-size: 14px; }
.pc-fail { margin: 0; color: #9b2d2a; font-weight: 600; }
.pc-from { display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: center; gap: 14px; }
.pc-from i { width: 64px; height: 64px; border-radius: 12px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); }
.pc-from strong { display: block; font-size: 18px; }
.pc-from small, .pc-list small { display: block; color: var(--chqt-muted); font-size: 14px; line-height: 1.35; }
.pc-answer { font-size: 17px; }
.pc-brand { margin-top: 14px; }
.pc-h { margin: 0 0 6px; font-weight: 700; font-size: 16px; }
.pc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pc-list li { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; padding: 6px; border-radius: 10px; border: 1px solid var(--chqt-line); background: #fff; }
.pc-list i { width: 44px; height: 44px; border-radius: 8px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15); }
.pc-list strong { display: block; font-size: 16px; }
.pc-sort { align-self: flex-start; font-size: 16px; min-height: 44px; }
.pc-sort[aria-pressed="true"] { background: var(--chqt-ink); color: #fff; }