/* Merchant selectors share the existing brand, type and surface tokens. */
.merchant-select-trigger, .merchant-product-picker, .merchant-choice-buttons { --select-surface: var(--paper-50); --select-gap: .75rem; --select-pad: 1rem; }
.merchant-select-trigger { display: flex; align-items: center; gap: var(--select-gap); width: 100%; min-width: 0; min-height: var(--control-min); padding: .625rem var(--select-gap); text-align: left; border: 1px solid var(--line-300); border-radius: var(--radius); background: var(--select-surface); color: var(--ink-900); font-size: var(--text-base); }
.merchant-select-trigger > .icon { flex: none; width: 1rem; height: 1rem; color: var(--ink-600); }
.merchant-select-trigger:hover:not(:disabled) { border-color: var(--ink-600); background: var(--paper-100); }
.merchant-select-trigger:focus-visible, .merchant-choice-buttons button:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 2px; }
.merchant-select-trigger[aria-invalid="true"] { border-color: var(--danger-600); }
.merchant-select-trigger:disabled, .merchant-choice-buttons button:disabled { opacity: .55; cursor: not-allowed; }
.merchant-select-trigger.is-placeholder { color: var(--ink-600); }
.merchant-picker-copy { display: grid; gap: .125rem; min-width: 0; flex: 1; overflow-wrap: anywhere; line-height: 1.45; }
.merchant-picker-copy strong { font-size: var(--text-base); font-weight: 600; }
.merchant-picker-copy small { color: var(--ink-600); font-size: var(--text-xs); font-weight: 400; }
.merchant-picker-thumb { position: relative; display: grid; place-items: center; flex: none; width: 2.75rem; height: 2.75rem; border-radius: var(--radius-sm); overflow: hidden; background: var(--paper-200); color: var(--ink-600); }
.merchant-picker-thumb img { width: 100%; height: 100%; object-fit: cover; }
.merchant-picker-thumb .icon { width: 1.125rem; height: 1.125rem; }
.merchant-product-picker { position: fixed; inset: auto; margin: 0; padding: 0; border: 1px solid var(--line-200); border-radius: var(--radius-sheet); color: var(--ink-900); background: var(--select-surface); box-shadow: var(--shadow-3); overflow: hidden; }
.merchant-product-picker:popover-open { display: flex; flex-direction: column; }
.merchant-product-picker::backdrop { background: transparent; }
.merchant-picker-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--select-gap); flex: none; padding: .375rem .5rem .25rem var(--select-pad); }
.merchant-picker-heading strong { font-size: var(--text-base); font-weight: 600; overflow-wrap: anywhere; }
.merchant-picker-heading button { flex: none; }
.merchant-picker-search { display: flex; align-items: center; gap: .5rem; flex: none; margin: 0 var(--select-gap); padding: 0 var(--select-gap); border: 1px solid var(--line-300); border-radius: var(--radius); background: var(--select-surface); }
.merchant-picker-search:focus-within { border-color: var(--brand-600); box-shadow: var(--focus); }
.merchant-picker-search > .icon { flex: none; width: 1rem; height: 1rem; color: var(--ink-600); }
.merchant-picker-search input { min-width: 0; width: 100%; padding: .625rem 0; min-height: var(--control-min); border: 0; outline: 0; box-shadow: none; background: transparent; color: var(--ink-900); font-size: 1rem; }
.merchant-picker-search input:focus { box-shadow: none; }
.merchant-product-picker .merchant-picker-search input:focus-visible { outline: none; box-shadow: none; }
.merchant-picker-count { flex: none; margin: 0; padding: .625rem var(--select-pad) .375rem; font-size: var(--text-xs); color: var(--ink-600); }
.merchant-picker-list { position: relative; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 0 .375rem .5rem; }
.merchant-picker-option { display: flex; align-items: center; gap: var(--select-gap); min-height: 4rem; padding: .5rem .625rem; border-radius: var(--radius-sm); cursor: pointer; }
.merchant-picker-option:hover, .merchant-picker-option.is-active { background: var(--paper-100); }
.merchant-picker-option[aria-selected="true"] { background: var(--brand-50); color: var(--brand-700); }
.merchant-picker-check { flex: none; width: 1.125rem; visibility: hidden; }
.merchant-picker-check .icon { width: 1.125rem; height: 1.125rem; }
.merchant-picker-option[aria-selected="true"] .merchant-picker-check { visibility: visible; }
.merchant-picker-empty { padding: 1rem; margin: 0; color: var(--ink-600); font-size: var(--text-sm); }
.merchant-picker-clear { flex: none; align-self: flex-start; min-height: var(--control-min); margin: 0 var(--select-pad) .25rem; }
.merchant-choice-buttons { display: flex; flex-wrap: wrap; gap: .5rem; min-width: 0; }
.merchant-choice-buttons button { min-height: var(--control-min); min-width: 44px; flex: 1 1 auto; padding: .625rem .875rem; border: 1px solid var(--line-300); border-radius: var(--radius); color: var(--ink-700); background: var(--select-surface); font-size: var(--text-sm); white-space: normal; overflow-wrap: anywhere; }
.merchant-choice-buttons button:hover:not(:disabled) { background: var(--paper-100); }
.merchant-choice-buttons button[aria-pressed="true"] { border-color: var(--brand-600); background: var(--brand-50); color: var(--brand-700); font-weight: 600; box-shadow: inset 0 0 0 1px var(--brand-600); }
.highlight-image-choice, .highlight-target-field { display: grid; gap: .5rem; min-width: 0; }
.modifier-copy-row > .modifier-edit-field { flex: 1 1 240px; }
.product-category-search { flex: none; width: calc(100% - 1rem); margin: 0 .5rem .5rem; min-height: var(--control-min); background: var(--picker-surface); color: var(--ink-900); font-size: 1rem; }
[data-theme="dark"] :is(.merchant-select-trigger,.merchant-product-picker,.merchant-choice-buttons) { --select-surface: #242424; --ink-900: #f5f5f5; --ink-700: #e4dcd6; --ink-600: #c1b8b1; --paper-100: #333; --paper-200: #3b3530; --line-200: #4a433e; --line-300: #62564d; --brand-50: #452c29; --brand-600: #df8174; --brand-700: #ffd0c8; }
@media (max-width: 767px) { .merchant-product-picker::backdrop { background: rgb(41 33 28 / 24%); } .merchant-picker-copy strong, .merchant-select-trigger { font-size: 1rem; } .merchant-picker-list { padding-bottom: max(.5rem, env(safe-area-inset-bottom)); } }