/* ========================================================================== Shared dropdown — the ONE dropdown for the whole admin (see js/modules/ dropdown.js). A styled trigger (.dd-trigger) replaces every native stays in the DOM (hidden) as the value source. ========================================================================== */ /* ---- Trigger (lives inside .admin-main, replaces the select visually) ---- */ .admin-main .dd-trigger { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-surface); color: var(--text-strong); font: 500 13px/1.25 var(--font-ui); cursor: pointer; text-align: left; vertical-align: middle; background-image: none; /* kill any inherited native-select arrow */ transition: border-color .15s ease, background-color .15s ease; } .admin-main .dd-trigger--auto { width: auto; min-width: 96px; max-width: 260px; } .admin-main .dd-trigger--block { width: 100%; } .admin-main .dd-trigger:hover:not([disabled]) { border-color: var(--border-hover); background: var(--card-bg); } .admin-main .dd-trigger[aria-expanded="true"] { border-color: var(--accent); } .admin-main .dd-trigger[disabled] { opacity: .45; cursor: default; } .admin-main .dd-trigger[hidden] { display: none !important; } .admin-main .dd-trigger__label { flex: 1 1 auto; min-width: 0; /* Never truncate the selected value — wrap long labels instead. */ white-space: normal; overflow: visible; line-height: 1.25; } .admin-main .dd-trigger__caret { flex: 0 0 auto; display: inline-flex; color: var(--text-muted); } .admin-main .dd-trigger__caret svg { width: 16px; height: 16px; } /* the native