/* Shared dropdowns for forms, filters, calendars, autocomplete and publishing. */
.ui-select{position:relative;display:inline-flex;vertical-align:middle;width:100%;min-width:0;margin-top:8px;font-weight:400}
.ui-select>select.ui-select-native{position:absolute!important;left:0!important;top:0!important;width:1px!important;height:1px!important;min-height:0!important;max-width:1px!important;margin:0!important;padding:0!important;border:0!important;opacity:0;pointer-events:none;clip-path:inset(50%)}
/* Touch devices use the system option picker over the same visual control. */
.ui-select.is-mobile-native>select.ui-select-native{width:100%!important;height:100%!important;max-width:none!important;clip-path:none;pointer-events:auto;z-index:2;font-size:16px}
.ui-select.is-mobile-native:has(>select:focus-visible) .ui-select-trigger{border-color:var(--primary);box-shadow:0 0 0 3px #3b5be810}
.ui-select .ui-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-width:0;min-height:44px;padding:11px 13px;border:1px solid var(--border,#e1e7f0);border-radius:10px;background:var(--surface-subtle,#f7f9fc);color:var(--text-primary,#172b4d);font:inherit;font-size:14px;line-height:1.5;text-align:left;cursor:pointer;transition:border-color .16s,background .16s,box-shadow .16s}
.ui-select input.ui-select-trigger{margin:0!important;padding-right:36px!important;cursor:text;box-sizing:border-box;text-overflow:ellipsis}
.ui-select-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;padding:0!important;border:0;background:transparent;color:var(--text-muted);border-radius:6px}
.ui-select-toggle:hover:not(:disabled){background:var(--primary-soft);color:var(--primary)}
.ui-select.has-icon>input.ui-select-trigger{padding-left:36px!important}.ui-select.has-icon>.ui-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);pointer-events:none}
.ui-select.has-icon>button.ui-select-trigger{padding-left:36px}.ui-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-select:has(input[aria-expanded=true]) .ui-select-toggle>.ui-icon{transform:rotate(180deg);color:var(--primary)}
.ui-select input::placeholder{color:var(--text-muted)}
.ui-select .ui-icon{width:16px;height:16px;flex:none;color:var(--text-muted,#8190a5);transition:transform .16s}
.ui-select-trigger:hover:not(:disabled){border-color:var(--primary-border,#b9cbfb);background:var(--surface,#fff)}
.ui-select-trigger[aria-expanded=true],.ui-select-trigger:focus-visible{border-color:var(--primary,#3b5be8);background:var(--surface,#fff);box-shadow:0 0 0 3px #3b5be810;outline:none}
.ui-select-trigger[aria-expanded=true]>.ui-icon{transform:rotate(180deg);color:var(--primary)}
.ui-select.is-empty .ui-select-value{color:var(--text-muted)}
.ui-select.is-disabled .ui-select-trigger{background:#f1f3f7;color:#9aa6b6;border-color:#e6eaf0;cursor:not-allowed;box-shadow:none}
.ui-select-trigger[aria-invalid=true]{border-color:#ce6858}
#experience-editor .question-editor-heading .ui-select.question-kind{width:112px;height:auto;flex:none;margin:0;padding:0;background:transparent}
#experience-editor .question-editor-heading .ui-select-trigger{height:auto;min-height:38px;font-size:13px;padding:8px 11px;color:var(--text-primary)}
.page-size .ui-select{width:110px;margin:0}.page-size .ui-select-trigger{min-height:34px;padding:6px 10px;background:var(--surface);font-size:12px;border-radius:7px}
.calendar-nav .ui-select{width:92px;margin:0}.calendar-nav .ui-select-trigger{min-height:32px;padding:5px 7px;font-size:12px;border-radius:7px;gap:5px;background:var(--surface);white-space:nowrap}
.calendar-nav .ui-select .ui-icon{width:12px;height:12px}
.advanced-filter-row>.ui-select{margin:0}.advanced-filter-row>.ui-select .ui-select-trigger{min-height:40px;font-size:12px;padding:8px 10px}
#catalog-dialog .ui-select{margin:0}#catalog-dialog .ui-select-trigger{min-height:38px;font-size:13px;background:var(--surface);border-radius:8px;padding:8px 10px}
.ui-autocomplete{display:block;position:relative;margin-top:8px;min-width:0;font-weight:400}
.ui-autocomplete>input{margin-top:0!important;padding-right:40px!important}
.ui-autocomplete-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:var(--text-muted);padding:0!important}
.ui-autocomplete-toggle:hover:not(:disabled){color:var(--primary);background:var(--primary-soft)}
.ui-autocomplete-toggle>.ui-icon{width:15px;height:15px;transition:transform .16s}
.ui-autocomplete:has(input[aria-expanded=true]) .ui-autocomplete-toggle>.ui-icon{transform:rotate(180deg);color:var(--primary)}

#control-popover.select-popover,#nested-select-popover.select-popover,.action-popover{position:fixed;inset:auto;margin:0;padding:6px;border:1px solid var(--border,#e4e9f2);border-radius:12px;background:var(--surface,#fff);color:var(--text-secondary,#46566f);box-shadow:0 12px 32px #1a2b4c14,0 3px 8px #1a2b4c08;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);font-size:13px;opacity:0;transform:translateY(-4px);transition:opacity .16s ease,transform .16s ease,display .16s allow-discrete,overlay .16s allow-discrete}
#control-popover.select-popover,#nested-select-popover.select-popover{display:flex;flex-direction:column;overflow:hidden;min-width:0;box-sizing:border-box}
#control-popover.select-popover:not(:popover-open),#nested-select-popover.select-popover:not(:popover-open),.action-popover:not(:popover-open){display:none}
#control-popover.select-popover:popover-open,#nested-select-popover:popover-open,.action-popover:popover-open{opacity:1;transform:translateY(0)}
@starting-style{#control-popover.select-popover:popover-open,#nested-select-popover:popover-open,.action-popover:popover-open{opacity:0;transform:translateY(-4px)}}
#nested-select-popover::backdrop,.action-popover::backdrop{background:transparent;backdrop-filter:none}
.select-popover .picker-heading{font-size:11px;font-weight:500;color:var(--text-muted);padding:8px 11px;margin:0;flex:none}
.select-popover .option-list{flex:1 1 auto;padding:0;max-height:320px;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d2d9e6 transparent;scroll-padding:6px}
.select-popover .select-option.is-active{outline:2px solid var(--primary-border);outline-offset:-2px;background:var(--surface-subtle)}
.select-popover .select-option{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-radius:7px;background:transparent;width:100%;padding:10px 12px;min-height:40px;color:var(--text-secondary);text-align:left;font:inherit;font-size:13px;line-height:1.5;cursor:pointer;transition:background .12s,color .12s;flex:none}
.select-option>span{min-width:0;overflow-wrap:anywhere}.select-option>.ui-icon{width:16px;height:16px;flex:none}
.select-popover .select-option:hover:not(:disabled){background:var(--surface-subtle,#f4f6f9)}
.select-popover .select-option[aria-selected=true]{color:var(--primary);background:var(--primary-soft,#eef3ff);font-weight:600}
.select-popover .select-option:focus-visible{outline:2px solid var(--primary-border);outline-offset:-2px;background:var(--surface-subtle)}
.select-popover .select-option[aria-selected=true]:focus-visible{background:var(--primary-soft)}
.select-popover .select-option:disabled{color:#a4afbf;cursor:not-allowed;background:transparent}
.select-popover .option-group{padding:12px 12px 5px;font-size:11px;color:var(--text-muted)}
.select-popover .option-search{display:flex;align-items:center;gap:8px;height:38px;margin:4px 4px 7px;padding:0 10px;background:var(--surface-subtle);border:1px solid var(--border);border-radius:8px;flex:none}
.select-popover .option-search:focus-within{border-color:var(--primary);box-shadow:0 0 0 2px #3b5be812;background:var(--surface)}
.select-popover .option-search>.ui-icon{width:16px;height:16px;flex:none;color:var(--text-muted)}
.select-popover .option-search input{margin:0!important;border:0!important;padding:0!important;width:100%;min-width:0;min-height:0;height:100%;border-radius:0;background:transparent;box-shadow:none!important;outline:none!important;font:inherit;font-size:13px;color:var(--text-primary)}
.select-popover .picker-empty{padding:18px 12px;margin:0;font-size:12px;line-height:1.7;color:var(--text-muted);text-align:center}
.topic-picker-columns{flex:1;display:grid;grid-template-columns:minmax(90px,32%) minmax(0,1fr);min-height:0;max-height:inherit;overflow:hidden}
.topic-directions{min-height:0;overflow:auto;border-right:1px solid var(--border);padding-right:6px;scrollbar-width:thin}
.topic-directions>button{display:block;width:100%;min-height:40px;padding:10px 8px;border:0;border-radius:7px;background:transparent;text-align:left;font:inherit;font-size:12px;color:var(--text-secondary)}
.topic-directions>button:hover{background:var(--surface-subtle)}
.topic-directions>button[aria-pressed=true]{color:var(--primary);background:var(--primary-soft)}
.role-picker-columns{display:grid;grid-template-columns:132px minmax(0,1fr);gap:8px;min-height:0;overflow:hidden;flex:1}
.role-picker-groups{overflow:auto;min-height:0;border-right:1px solid var(--border);padding-right:8px;overscroll-behavior:contain}
.role-picker-groups button{display:block;width:100%;min-height:42px;padding:10px;border:0;border-radius:7px;background:transparent;color:var(--text-secondary);font:inherit;font-size:13px;text-align:left;line-height:1.5}
.role-picker-groups button:hover{background:var(--surface-subtle)}
.role-picker-groups button[aria-pressed=true]{background:var(--primary-soft);color:var(--primary);font-weight:600}
.role-picker-groups button:focus-visible{outline:2px solid var(--primary-border);outline-offset:-2px}
.role-popover .option-list{max-height:320px;min-height:0}
.role-popover .option-group{font-weight:600;border-top:1px solid var(--border);margin-top:6px;padding-top:12px}
.topic-group-popover .role-picker-columns{grid-template-columns:minmax(112px,36%) minmax(0,1fr)}
.topic-group-popover .role-picker-groups button,.topic-group-popover .select-option{min-height:44px;font-size:14px;overflow-wrap:anywhere}
.topic-group-popover .role-picker-groups button{position:relative;padding-left:14px}
.topic-group-popover .role-picker-groups button[aria-pressed=true],.topic-group-popover .select-option[aria-selected=true]{background:transparent;color:var(--primary)}
.topic-group-popover .role-picker-groups button[aria-pressed=true]::before{content:'';position:absolute;left:3px;top:50%;width:3px;height:18px;border-radius:2px;transform:translateY(-50%);background:var(--primary)}
.topic-group-popover .option-group:first-child{margin-top:0;border-top:0;padding-top:10px}
.topic-direction-heading{padding:14px 8px 5px;font-size:11px;font-weight:600;color:var(--text-muted)}
@media(max-width:480px){.role-picker-columns{grid-template-columns:104px minmax(0,1fr);gap:6px}.role-picker-groups{padding-right:6px}.role-picker-groups button{padding:10px 7px;font-size:12px;min-height:44px}.role-popover .select-option{padding:10px 8px;min-height:44px}}
.topic-popover{box-sizing:border-box}.topic-popover .option-list{min-height:0;max-height:320px;padding-left:6px}
.topic-popover .select-option.is-active{outline:2px solid var(--primary-border);outline-offset:-2px;background:var(--surface-subtle)}
.compact-selects .filter-trigger[aria-expanded=true]{background:var(--surface);color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary-border),0 0 0 3px #3b5be80a;border-radius:8px}
.compact-selects .filter-trigger>.ui-icon:last-child,.top-publish .publish-chevron>.ui-icon{transition:transform .16s}
.compact-selects .filter-trigger[aria-expanded=true]>.ui-icon:last-child,.top-publish[aria-expanded=true] .publish-chevron>.ui-icon{transform:rotate(180deg)}

#publish-menu{width:282px;overflow:auto;padding:7px}
#publish-menu>[role=menuitem]{display:flex;align-items:center;gap:12px;padding:11px 10px;width:100%;border:0;border-radius:8px;background:transparent;text-align:left;color:var(--text-primary);font:inherit;cursor:pointer}
#publish-menu>[role=menuitem]:hover,#publish-menu>[role=menuitem]:focus-visible{background:var(--primary-soft);outline:none}
#publish-menu .publish-kind-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:9px;background:var(--primary-soft);color:var(--primary)}
#publish-menu .publish-kind-icon .ui-icon{width:20px;height:20px}
#publish-menu .algorithm-icon{background:#f2efff;color:#7963c4}#publish-menu .discussion-icon{background:#ecf6f6;color:#458987}
#publish-menu strong{display:block;font-size:14px;font-weight:600;line-height:1.5}#publish-menu small{display:block;margin-top:3px;font-size:11px;font-weight:400;color:var(--text-muted);line-height:1.6}
.topbar .top-publish .publish-chevron{display:flex;align-items:center;margin-left:1px}.topbar .top-publish .publish-chevron>.ui-icon{width:12px;height:12px}
#post-form>.forum-editor-footer{gap:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
#post-form .editor-publish-status{min-width:0;flex:1}
#post-form .forum-editor-footer .identity-control{margin:0;gap:5px 14px}
#post-form .editor-publish-status>span{display:block;margin-top:6px;color:var(--text-muted);font-size:11px}
#post-form .forum-editor-footer .button{flex:none}

@media(max-width:600px){
 .ui-select .ui-select-trigger{font-size:16px;min-height:44px}#experience-editor .question-editor-heading .ui-select.question-kind{width:106px}#experience-editor .question-editor-heading .ui-select-trigger{font-size:14px}
 .select-popover .select-option{min-height:44px}.select-popover .option-search input{font-size:16px}
 .ui-autocomplete>input{font-size:16px!important}.calendar-nav .ui-select-trigger,.page-size .ui-select-trigger{font-size:12px;min-height:44px}
 #post-form>.forum-editor-footer{gap:10px;padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
 #post-form .forum-editor-footer .identity-hint{flex-basis:100%;font-size:11px}#post-form .forum-editor-footer .button{padding:10px 14px;font-size:12px}
 #publish-menu{width:268px}.topbar .top-publish{gap:5px}
}
@media(prefers-reduced-motion:reduce){
 #control-popover.select-popover,#nested-select-popover.select-popover,.action-popover,.ui-select-trigger,.ui-select .ui-icon,.select-option,.ui-autocomplete-toggle>.ui-icon,.compact-selects .filter-trigger>.ui-icon:last-child,.top-publish .publish-chevron>.ui-icon{transition:none;animation:none}
}

/* The same topic picker is used in quick and advanced filters. */
.topic-popover:popover-open{display:flex;flex-direction:column;overflow:hidden}
.topic-popover .topic-picker-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.topic-popover .topic-picker-heading small{font-weight:400;color:var(--text-muted);font-size:12px}
.topic-popover .topic-picker-columns{grid-template-columns:minmax(104px,32%) minmax(0,1fr);min-height:0;max-height:340px;flex:1}
.topic-popover .topic-picker-single{grid-template-columns:minmax(0,1fr)}
.topic-popover .topic-picker-single .option-list{padding-left:0}
.topic-popover .topic-directions,.topic-popover .option-list{min-height:0;overflow-y:auto;overscroll-behavior:contain;max-height:340px}
.topic-popover .topic-directions button{white-space:normal;overflow-wrap:anywhere;text-align:left}
.topic-popover .select-option span{white-space:normal;overflow-wrap:anywhere}
.topic-popover .topic-section-heading{padding:14px 12px 5px;font-size:11px;font-weight:600;line-height:1.5;color:var(--text-muted);pointer-events:none}
.topic-popover .option-list>.topic-section-heading:not(:first-child){border-top:1px solid var(--border);margin-top:6px}

/* The same anchored pagination menu serves lists and the reader directory. */
@media(max-width:700px){
 .page-size-popover .picker-heading{font-size:12px;padding:8px 12px}
 .page-size-popover .select-option{min-height:48px;font-size:14px}
}