/* Talk Select visual contract for independent SDK apps (React and vanilla). */
select[data-youuay-select] { display: none !important; }
.yu-select-trigger.yu-select-trigger {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 12px;
  min-width: 0; max-width: 100%; min-height: 44px; padding: 10px 12px;
  border: 1px solid var(--youuay-border-strong); border-radius: 12px;
  background: var(--youuay-surface); background-image: none;
  color: var(--youuay-text); font-family: var(--youuay-body); font-size: 15px; font-weight: 500; line-height: 1.4;
  text-align: left; cursor: pointer; touch-action: manipulation; transition: border-color .15s, background .15s;
}
.yu-select-trigger:hover { border-color: var(--youuay-muted); }
.yu-select-trigger:focus-visible, .yu-select-trigger[aria-expanded="true"] { outline: 2px solid var(--youuay-accent); outline-offset: 2px; }
.yu-select-trigger:disabled { opacity: .5; cursor: not-allowed; }
.yu-select-caption { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.yu-select-arrow { flex: 0 0 7px; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); opacity: .65; }
.yu-select-trigger[aria-expanded="true"] .yu-select-arrow { transform: translateY(2px) rotate(225deg); }
.yu-select-popup {
  position: fixed; z-index: 2147483647; display: flex; flex-direction: column; box-sizing: border-box;
  overflow: hidden; padding: 4px; border: 1px solid var(--youuay-border-strong); border-radius: 12px;
  background: var(--youuay-surface); color: var(--youuay-text); font: 15px/1.45 var(--youuay-body);
  box-shadow: 0 12px 36px #0004; text-transform: none; letter-spacing: normal;
}
.yu-select-options { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.yu-select-popup .yu-select-option {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 44px;
  padding: 10px 12px; border: 0; border-radius: 8px; background: transparent; color: inherit;
  font: inherit; line-height: 1.45; text-transform: none; letter-spacing: normal; text-align: left; cursor: pointer; white-space: normal;
}
.yu-select-option-label { min-width: 0; overflow-wrap: anywhere; }
.yu-select-popup .yu-select-option.yu-select-highlight, .yu-select-popup .yu-select-option:hover { background: color-mix(in srgb, var(--youuay-accent) 16%, transparent); }
.yu-select-popup .yu-select-option[aria-selected="true"] { color: var(--youuay-accent-text); font-weight: 600; }
.yu-select-popup .yu-select-option:disabled { opacity: .4; cursor: not-allowed; }
.yu-select-check { flex-shrink: 0; width: 16px; }
.yu-select-search { flex-shrink: 0; padding: 6px; border-bottom: 1px solid var(--youuay-border); }
.yu-select-popup .yu-select-search-input {
  display: block; width: 100%; box-sizing: border-box; min-height: 44px; padding: 10px 12px;
  border: 1px solid var(--youuay-border-strong); border-radius: 8px; outline: none;
  background: var(--youuay-surface2); color: var(--youuay-text); font: inherit; font-size: 16px;
}
.yu-select-search-input:focus { border-color: var(--youuay-accent); }
.yu-select-empty, .yu-select-group { padding: 12px; color: var(--youuay-muted); }
.yu-select-group { font-size: 13px; font-weight: 600; }
@media(max-width:767px) { .yu-select-trigger.yu-select-trigger { min-height: 48px; font-size: 16px; } }
