/* PAGE FAMILY: search-by-color checkbox finder (C5) - SKIN tier - from site-artsdot-V2.0.css, original order. Migrated 2026-07-06. */

.color-search-page .search-form { margin-top: 24px; }

.color-search-page .color-search-intro {
  font-size: 1.05em; color: var(--adc-text-2, #555); line-height: 1.65; max-width: 52em;
}

.color-search-page .filter-row {
  display: flex; gap: 18px; align-items: flex-start;
  border-bottom: 1px solid var(--adc-line, #e6e6e6); padding: 14px 0;
}

.color-search-page .filter-row-label { min-width: 280px; font-weight: 600; color: var(--adc-ink, #111110); }

.color-search-page .filter-row-description {
  margin-top: 6px; font-size: 0.95em; line-height: 1.5;
  color: var(--adc-text-3, #666); font-weight: 400; max-width: 360px;
}

.color-search-page .filter-row-options { display: flex; flex-wrap: wrap; gap: 10px 18px; flex: 1; }

.color-search-page .filter-row-options-stacked { display: block; }

.color-search-page .filter-option {
  display: inline-flex; align-items: flex-start; gap: 6px; margin: 0;
  color: var(--adc-ink-2, #6e6c68); max-width: 100%;
}

.color-search-page .filter-option span { white-space: normal; word-break: break-word; line-height: 1.35; }

.color-search-page .main-color-list { list-style: none; padding: 0; margin: 0; display: block; }

.color-search-page .main-color-list li {
  margin-bottom: 8px; padding: 6px 10px;
  background: var(--adc-band, #f5f5f5); border: 1px solid var(--adc-line-2, #d6d6d6); border-radius: 4px;
  transition: border-color .2s ease, background .2s ease;
}

.color-search-page .main-color-list li:hover {
  border-color: var(--adc-accent, #b3402a);
}

.color-search-page .main-color-list label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; width: 100%; }

.color-search-page .main-color-list input[type="checkbox"] {
  position: static; opacity: 1; width: 1.1em; height: 1.1em; flex-shrink: 0; margin: 0; cursor: pointer;
  accent-color: var(--adc-accent, #b3402a);
}

.color-search-page input[type="checkbox"] { accent-color: var(--adc-accent, #b3402a); }

.color-search-page .hue-gradient-list { list-style: none; padding: 0; margin: 0; }

.color-search-page .hue-gradient-list li { margin-bottom: 8px; }

.color-search-page .hue-gradient-list label { display: inline-flex; align-items: flex-start; gap: 8px; cursor: pointer; }

.color-search-page .hue-gradient-swatch {
  display: inline-block; flex-shrink: 0; width: 56px; height: 18px; border-radius: 4px;
  border: 1px solid var(--adc-line-2, #d6d6d6); vertical-align: middle; margin-right: 4px;
}

.color-search-page .color-dot {
  display: inline-block; width: 18px; height: 18px; border-radius: 50%;
  border: 1px solid var(--adc-line-2, #d6d6d6); vertical-align: middle; flex-shrink: 0;
}

.color-search-page .filter-actions { margin-top: 24px; }

.color-search-page #artworks-results { margin-top: 40px; }

@media (max-width: 768px) {
  .color-search-page .filter-row { flex-direction: column; gap: 8px; }

  .color-search-page .filter-row-label { min-width: auto; }

}

/* ── search submit button — ADC brand values (measured from the git-HEAD
   reference render; the brand's legacy .addToCart override died with A1z) ── */
.color-search-page .color-search-submit-button {
  background-color: rgb(17, 17, 16);
  color: rgb(255, 255, 255);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.52px;
  text-transform: none;
  padding: 10px 20px;
  border-radius: 999px;
  width: auto;
  font-family: Archivo, "Helvetica Neue", Helvetica, Arial, sans-serif;
}