/* One presentation for account and bot platform selects; original brand artwork
   is contained, never cropped, recolored or stretched. Popup uses the top layer. */
.platform-picker { position: relative; display: block; width: 100%; min-width: 0; margin-top: 12px; }
#botForm .form-grid > label > .platform-picker { margin-top: 6px; }
/* Original required select remains the value/validity owner. Collection select sizing
   must not expand this clipped native target beyond the viewport. */
.platform-picker-native {
  position: absolute; inset: 0 auto auto 0; width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important;
  padding: 0; margin: 0; border: 0; clip-path: inset(50%); overflow: hidden;
  white-space: nowrap;
}
.platform-picker .platform-picker-trigger {
  width: 100%; min-width: 0; min-height: 52px; padding: 10px 14px;
  display: flex; align-items: center; gap: 12px; text-align: start;
  border: 1px solid var(--border, #34435d); border-radius: 12px;
  background: var(--input-bg, #09121e); color: var(--text, #eaf2ff);
  font: inherit; line-height: 1.35; letter-spacing: normal;
  box-shadow: none; transform: none; cursor: pointer;
}
.platform-picker-selected { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; }
.platform-picker-text { min-width: 0; overflow-wrap: anywhere; white-space: normal; }
.platform-picker-logo { display: block; width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
/* Canonical AI artwork stays unchanged. A neutral badge keeps external SVG
   currentColor (black) legible without inverting multicolor provider logos.
   Trading platform assets do not belong to this source family. */
img[src^="/renderer-assets/2820eb82c9728f599d004a95967f5380a89b9505430984c31ee8ad630696faa0/assets/providers/provider-"][src$=".svg"] {
  background: #eef3f8; border: 1px solid #bdc8d6; border-radius: 4px;
  box-sizing: border-box; padding: 1px;
}
.platform-picker-chevron { width: 8px; height: 8px; flex: 0 0 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); opacity: .75; }
.platform-picker .platform-picker-trigger:is(:hover, :active, :focus-visible) { transform: none; }
.platform-picker .platform-picker-trigger:focus-visible { outline: 2px solid var(--accent, #7ddfff); outline-offset: 3px; }
.platform-picker .platform-picker-trigger[aria-expanded="true"] { border-color: var(--accent, #7ddfff); }
.platform-picker .platform-picker-trigger:disabled { opacity: .55; cursor: not-allowed; }
.platform-picker-menu {
  position: fixed; inset: auto; margin: 0; box-sizing: border-box;
  min-width: 0; max-width: calc(100dvw - 16px); max-height: min(336px, calc(100dvh - 16px));
  overflow: auto; overscroll-behavior: contain; scrollbar-width: thin;
  padding: 6px; border: 1px solid #354a65; border-radius: 14px;
  background: #10192c; color: var(--text, #eaf2ff);
  box-shadow: 0 12px 36px #0009; font: inherit; line-height: 1.35;
}
.platform-picker-menu::backdrop { background: transparent; }
.platform-picker-option {
  display: flex; align-items: center; gap: 10px; min-width: 0; min-height: 48px;
  padding: 9px 10px; border: 1px solid transparent; border-radius: 8px;
  cursor: pointer; touch-action: pan-y;
}
.platform-picker-option .platform-picker-text { flex: 1; }
.platform-picker-check { width: 18px; flex: 0 0 18px; color: #8be3ff; visibility: hidden; }
.platform-picker-option[aria-selected="true"] { background: #20364b; border-color: #5c9ebb80; }
.platform-picker-option[aria-selected="true"] .platform-picker-check { visibility: visible; }
.platform-picker-option.is-highlighted { outline: 2px solid #8be3ff; outline-offset: -2px; background: #203b54; }
.platform-picker-option[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
@media (hover: hover) and (pointer: fine) {
  .platform-picker .platform-picker-trigger:not(:disabled):hover { background: #15243a; border-color: #6ba4c2; }
  .platform-picker-option:not([aria-disabled="true"]):hover { background: #29425b; }
}
.platform-picker-option:not([aria-disabled="true"]):active { background: #31526c; }
@media (max-width: 480px) {
  .platform-picker .platform-picker-trigger { padding-inline: 10px; gap: 8px; }
  .platform-picker-selected, .platform-picker-option { gap: 8px; }
}
/* Grouped and searchable lists (TradingView brokers in the account form). */
.platform-picker-option[hidden], .platform-picker-group[hidden] { display: none !important; }
.platform-picker-group-label {
  padding: 10px 10px 4px; color: var(--muted, #9fb0c8); font-size: 13px; font-weight: 600;
  letter-spacing: .02em; border-top: 1px solid #2a3b55; margin-top: 4px;
}
.platform-picker-list > .platform-picker-group:first-child .platform-picker-group-label { border-top: 0; margin-top: 0; }
.platform-picker-search {
  position: sticky; top: -6px; z-index: 1; box-sizing: border-box; width: 100%; min-height: 40px;
  margin: 0 0 6px; padding: 8px 12px; border: 1px solid #354a65; border-radius: 10px;
  background: #0b1424; color: var(--text, #eaf2ff); font: inherit;
}
.platform-picker-search:focus-visible { outline: 2px solid var(--accent, #7ddfff); outline-offset: 1px; }