/* Shared dropdown controls for catalogue filters, enquiries and the team area. */
select:not([multiple]):not([size]) {
  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='m5.5 7.5 4.5 4.5 4.5-4.5' stroke='%230e7778' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  appearance:none;
  -webkit-appearance:none;
  background-image:var(--select-arrow);
  background-position:right 16px center;
  background-size:20px 20px;
  background-repeat:no-repeat;
  padding-inline-start:16px;
  padding-inline-end:48px;
  min-height:48px;
  max-width:100%;
  border:1px solid #b8cac7;
  border-radius:10px;
  color:var(--navy);
  background-color:#fcfdfc;
  cursor:pointer;
  text-overflow:ellipsis;
  transition:border-color 160ms ease,box-shadow 160ms ease,background-color 160ms ease;
}
select:not([multiple]):not([size]):hover:not(:disabled) { border-color:#6d9996; }
select:not([multiple]):not([size]):focus-visible {
  outline:3px solid #0e82812b;
  outline-offset:2px;
  border-color:#0e8281;
  box-shadow:0 1px 5px #10243d0a;
}
select option,select optgroup { background:#fff; color:#18334d; }
select optgroup { font-weight:650; }
.field input[list] {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='m5.5 7.5 4.5 4.5 4.5-4.5' stroke='%230e7778' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position:right 16px center;
  background-size:20px 20px;
  background-repeat:no-repeat;
  padding-inline-end:48px;
}
.field input[list]::-webkit-calendar-picker-indicator { opacity:0; }
select:disabled { background-color:#f0f3f2; color:#78888d; opacity:.75; cursor:not-allowed; }
select[aria-invalid=true] { border-color:#ae4527!important; }
.search-panel select:not([multiple]):not([size]) {
  --select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='m5.5 7.5 4.5 4.5 4.5-4.5' stroke='%23e4efef' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  padding-inline-start:22px;
  background-color:#ffffff0e;
  color:#fff;
  border-color:#ffffff29;
  border-radius:999px;
}
.search-panel select:not([multiple]):not([size]):hover { background-color:#ffffff15; border-color:#7faaa9; }
.search-panel select:not([multiple]):not([size]):focus-visible { border-color:#49c9c6; outline-color:#49c9c64d; }
.search-row { align-items:stretch; }
.search-row .category-select { flex-basis:220px; }
.rfq-product-menu {
  top:calc(100% + 9px);
  border:1px solid #d3e1dd;
  border-radius:14px;
  box-shadow:0 16px 42px #081c3433,0 2px 6px #081c3414;
}
.rfq-product-menu ul { padding:7px; max-height:320px; scrollbar-width:thin; scrollbar-color:#adc7c1 #f6f9f8; }
.rfq-product-menu [role=option] { gap:6px; padding:12px 14px; border-radius:8px; min-height:64px; border-bottom:1px solid #edf2f0; }
.rfq-product-menu [role=option]:last-child { border-bottom-color:transparent; }
.rfq-product-menu [role=option]:hover,.rfq-product-menu [aria-selected=true] { background:#eaf5f2; box-shadow:inset 3px 0 #0e8281; }
.rfq-product-name { font-size:14px; line-height:1.5; font-weight:650; }
.rfq-product-meta { display:flex; flex-wrap:wrap; gap:3px 12px; align-items:baseline; }
.rfq-product-cas { font-size:11px; color:#416864; font-variant-numeric:tabular-nums; }
.rfq-product-generic { font-size:11px; font-weight:400; color:#687982; line-height:1.5; }
.rfq-product-menu .rfq-product-status { padding:11px 16px; color:#61747a; background:#f6f9f8; font-size:11px; }
.suggestion-enquiry { padding:13px 16px; }
@media(max-width:620px) {
  .search-row .category-select { flex-basis:100%; }
  .rfq-product-menu ul { max-height:260px; }
  .rfq-product-menu [role=option] { padding:11px 12px; }
  .rfq-product-meta { flex-direction:column; gap:3px; }
}
@media(prefers-reduced-motion:reduce) { select:not([multiple]):not([size]) { transition:none; } }
@media(forced-colors:active) {
  select:not([multiple]):not([size]) { appearance:auto; background-image:none; padding-inline-end:12px; }
  .field input[list] { background-image:none; }
  .field input[list]::-webkit-calendar-picker-indicator { opacity:1; }
  .rfq-product-menu [role=option]:hover,.rfq-product-menu [aria-selected=true] { outline:2px solid Highlight; }
}