/* Custom platform-select dropdown — shared across header + standalone templates.
 * Replaces native <select> so options can render proper brand SVG icons. */

.bu-pselect { position: relative; display: inline-flex; align-items: center; border-right: 1px solid #e2e8f0; margin-right: 6px; }
/* min-width keeps the trigger from shrinking around the shortest label ("iOS"),
   so picking Android/YouTube doesn't shift the rest of the form sideways.
   justify-content:space-between pins the chevron to the right edge regardless of the label width. */
.bu-pselect-toggle { display: inline-flex; align-items: center; justify-content: space-between; min-width: 105px; border: none; background: transparent; cursor: pointer; font-size: 14px; color: #475569; font-weight: 600; padding: 4px 8px 4px 6px; font-family: inherit; line-height: 1; gap: 8px; }
.bu-pselect-toggle:hover { color: #1a1a2e; }
.bu-pselect-current { display: inline-flex; align-items: center; }
.bu-pselect-chevron { transition: transform .15s; flex-shrink: 0; }
.bu-pselect-toggle[aria-expanded="true"] .bu-pselect-chevron { transform: rotate(180deg); }
.bu-pselect-menu { position: absolute; top: calc(100% + 6px); left: 0; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 8px 24px rgba(15, 23, 42, .12); padding: 4px; min-width: 150px; z-index: 1100; list-style: none; margin: 0; }
.bu-pselect-menu li { display: flex; align-items: center; padding: 8px 12px; cursor: pointer; border-radius: 6px; font-size: 14px; color: #1a1a2e; font-weight: 600; }
.bu-pselect-menu li:hover, .bu-pselect-menu li:focus { background: #f1f5f9; outline: none; }
.bu-pselect-menu li.is-selected { background: #f8fafc; }
.bu-pselect-menu li.is-selected::after { content: "✓"; margin-left: auto; color: #16a34a; font-weight: 800; padding-left: 8px; }