/* Scoped component: inherits the storefront typeface and loads no remote assets. */
.founda-picker {
  --picker-ink: #181818;
  --picker-muted: #505050;
  --picker-line: #d4d4d4;
  --picker-surface: #fff;
  --picker-focus: #155e75;
  color: var(--picker-ink);
  background: var(--picker-surface);
  border: 1px solid var(--picker-line);
  border-radius: 0.75rem;
  padding: 24px;
  margin-block: 24px;
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.5rem;
}
.founda-picker *, .founda-picker *::before, .founda-picker *::after { box-sizing: border-box; }
.founda-picker [hidden] { display: none !important; }
.founda-picker h3, .founda-picker h4 { color: var(--picker-ink); font-style: normal; font-weight: 600; text-wrap: balance; }
.founda-picker h3 { font-size: 1.25rem; line-height: 1.75rem; margin: 0 0 12px; }
.founda-picker h4 { font-size: 1rem; line-height: 1.5rem; margin: 0; }
.founda-picker p { font-size: 0.875rem; line-height: 1.25rem; margin: 0 0 12px; text-wrap: pretty; overflow-wrap: anywhere; }
.founda-picker a { color: var(--picker-focus); text-decoration: underline; text-underline-offset: 2px; }
.founda-picker a:hover { color: var(--picker-ink); }
.founda-picker-filters { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-block: 16px; }
.founda-picker-filters label { display: grid; gap: 8px; flex: 1 1 16rem; min-width: 0; font-weight: 600; font-size: 0.875rem; line-height: 1.25rem; }
.founda-picker input, .founda-picker select {
  width: 100%; min-width: 0; min-height: 48px; height: auto;
  padding: 8px 12px; border: 1px solid #737373; border-radius: 0.375rem;
  background: var(--picker-surface); color: var(--picker-ink); font: inherit;
}
.founda-picker button {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 8px 12px; margin: 0; border: 1px solid var(--picker-ink);
  border-radius: 0.375rem; background: var(--picker-ink); color: #fff;
  font-family: inherit; font-size: 1rem; line-height: 1.5rem; font-style: normal;
  font-weight: 600; text-transform: none; letter-spacing: normal; cursor: pointer;
  white-space: normal; text-align: center;
}
.founda-picker button:hover:not(:disabled) { background: #313131; color: #fff; }
.founda-picker button:active:not(:disabled) { transform: scale(0.98); }
.founda-picker button:disabled { background: #eee; color: #505050; border-color: #a3a3a3; cursor: default; }
.founda-picker :is(button, input, select, a):focus-visible { outline: 3px solid var(--picker-focus); outline-offset: 4px; }
.founda-picker-status { min-height: 24px; color: var(--picker-muted); }
.founda-picker-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.founda-picker-card { display: flex; flex-direction: column; align-items: stretch; gap: 12px; border: 1px solid var(--picker-line); padding: 12px; border-radius: 0.5rem; min-width: 0; }
.founda-picker-card p { margin: 0; }
.founda-picker-card > button, .founda-picker-card > a { margin-top: auto; }
.founda-picker-media { position: relative; aspect-ratio: 1; background: #f5f5f5; }
.founda-picker-media img { display: block; width: 100%; height: 100%; object-fit: contain; }
.founda-picker .founda-picker-quickview { position: absolute; inset-inline-end: 8px; inset-block-end: 8px; width: 48px; height: 48px; padding: 12px; border-radius: 50%; }
.founda-picker-quickview svg { display: block; width: 24px; height: 24px; flex: 0 0 24px; }
.founda-picker-no-image { display: grid; place-items: center; height: 100%; min-height: 96px; padding: 16px; color: var(--picker-muted); text-align: center; }
.founda-picker-price { font-size: 0.875rem; line-height: 1.25rem; overflow-wrap: anywhere; }
.founda-picker-price small { display: block; font-size: 0.75rem; line-height: 1rem; font-style: normal; }
.founda-picker-empty { grid-column: 1 / -1; padding: 24px; background: #f5f5f5; }
.founda-picker-skeleton { min-height: 16rem; background: #eee; border: 1px solid var(--picker-line); border-radius: 0.5rem; }
.founda-picker-pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; margin-top: 16px; }
.founda-picker-dialog {
  color: var(--picker-ink); background: var(--picker-surface); border: 1px solid var(--picker-line);
  border-radius: 0.75rem; padding: 24px; width: min(48rem, calc(100vw - 32px));
  max-height: calc(100dvh - 32px); overflow: auto; overscroll-behavior: contain;
}
.founda-picker-dialog:not([open]) { display: none; }
.founda-picker-dialog::backdrop { background: rgb(0 0 0 / 64%); }
.founda-picker .founda-picker-close { display: flex; margin: 0 0 16px auto; }
.founda-picker-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.founda-picker-gallery img { display: block; width: 100%; max-height: 24rem; aspect-ratio: 1; object-fit: contain; background: #f5f5f5; }
.founda-picker-gallery img:first-child { grid-column: 1 / -1; }
.founda-picker-dialog [data-picker-detail] > :is(button, a) { margin-inline-end: 12px; margin-block-end: 16px; }
.founda-picker-dialog [data-picker-dialog-status] { margin-top: 16px; }
@media (max-width: 48rem) {
  .founda-picker-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .founda-picker { padding: 16px; }
}
@media (max-width: 32rem) {
  .founda-picker-results { grid-template-columns: minmax(0, 1fr); }
  .founda-picker-filters { align-items: stretch; }
  .founda-picker-filters > * { flex-basis: 100%; }
  .founda-picker-dialog { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .founda-picker button:active:not(:disabled) { transform: none; }
}