/* One Voice — Select2-style dropdowns (shared by app and admin) */
.s2-hidden { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; overflow: hidden; }
.s2 { display: inline-flex; align-items: center; position: relative; box-sizing: border-box; vertical-align: middle; cursor: pointer; background: #fff; border: 1px solid #e4e7e9; border-radius: 10px; height: 42px; padding: 0 12px; min-width: 120px; transition: border-color .15s, box-shadow .15s; }
.s2-sel { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; width: 100%; height: 100%; cursor: pointer; font: inherit; color: inherit; }
.s2-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left; }
.s2-arrow { flex: none; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #8a969b; transition: transform .15s; }
.s2.s2-open .s2-arrow { transform: rotate(180deg); }
.s2.s2-open, .s2:focus-within { border-color: #e39a28; box-shadow: 0 0 0 3px rgba(227,154,40,.18); }
.s2.s2-placeholder .s2-text { color: #8a969b; }
.s2.s2-disabled { background: #f4f6f7; cursor: default; opacity: .7; }
.s2.s2-disabled .s2-sel { cursor: default; }

/* the open list */
.s2-drop { position: fixed; z-index: 1000; background: #fff; color: #1b2327; border: 1px solid #d6dbde; border-radius: 10px; box-shadow: 0 12px 32px rgba(16,24,28,.18); overflow: hidden; display: flex; flex-direction: column; max-width: 360px; font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif; outline: 0; }
.s2-search { padding: 8px; border-bottom: 1px solid #edf0f1; }
.s2-search input { width: 100%; box-sizing: border-box; height: 34px; border: 1px solid #d6dbde; border-radius: 8px; padding: 0 10px; font: inherit; font-size: .92em; outline: 0; }
.s2-search input:focus { border-color: #e39a28; }
.s2-list { list-style: none; margin: 0; padding: 4px; max-height: 248px; overflow-y: auto; }
.s2-list li { padding: 9px 12px; border-radius: 7px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 8px; }
.s2-list li.s2-hi { background: #fdf3e3; }
.s2-list li.s2-on { font-weight: 700; }
.s2-list li.s2-on::after { content: ""; margin-left: auto; width: 5px; height: 10px; border: solid #c7811a; border-width: 0 2px 2px 0; transform: rotate(45deg); flex: none; }
.s2-list li.s2-off { opacity: .45; cursor: default; }
.s2-list li mark { background: none; color: #c7811a; font-weight: 700; }
.s2-list li.s2-none { color: #8a969b; cursor: default; }
.s2-drop.s2-dark { background: #2d3a40; color: #fff; border-color: #3b4a51; }
.s2-drop.s2-dark .s2-list li.s2-hi { background: #3b4a51; }

/* ---- where dropdowns sit in admin ---- */
.role-select.s2 { height: 34px; min-width: 170px; }
.field > .s2, .drawer .s2 { display: flex; width: 100%; }
.pg-per .s2 { height: 32px; min-width: 66px; padding: 0 8px; border-radius: 8px; font-weight: 600; }
.role-switch .s2 { display: flex; width: 100%; height: 36px; background: #2d3a40; border-color: #3b4a51; color: #fff; font-weight: 600; }
.role-switch .s2 .s2-arrow { border-top-color: #aab5ba; }

/* ---- where dropdowns sit in the mobile app ---- */
.form .field .s2 { display: flex; width: 100%; height: 52px; border-radius: 12px; padding: 0 14px; font-size: 17px; }
.form .field .s2.s2-open, .form .field .s2:focus-within { box-shadow: 0 0 0 3px rgba(227,154,40,.18); }
