/* One select treatment for filters, ministry forms, administration and picker fields.
   The real select/options retain names, values, validation and browser keyboard support. */
:root{
 --select-surface:#fff;
 --select-hover:#f7f9fd;
 --select-tint:#edf2fd;
 --select-active:#1c48ab;
 --select-border-hover:#b6c6df;
 --select-focus:#92b3ff;
 --select-scrollbar:#b8c7e0;
 --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23536279' stroke-width='1.65' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
:is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select{
 appearance:none;
 min-width:0;
 max-width:100%;
 min-height:44px;
 padding:10px 40px 10px 14px;
 border:1px solid var(--line,#dce3ed);
 border-radius:8px;
 background:var(--select-surface) var(--select-chevron) no-repeat right 14px center;
 color:var(--ink,#18243a);
 font-family:inherit;
 font-weight:400;
 line-height:1.5;
 cursor:pointer;
 color-scheme:light;
}
:is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select:hover:not(:disabled){
 border-color:var(--select-border-hover);
 background-color:var(--select-hover);
}
:is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select:required:invalid{
 color:var(--muted,#536279);
}
:is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select:focus-visible{
 outline:3px solid var(--select-focus);
 outline-offset:3px;
 border-color:var(--blue,#2456ca);
}
:is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select:disabled{
 opacity:.55;
 background-color:var(--canvas,#f4f6fa);
 cursor:not-allowed;
}
/* Compact date/time popovers retain space for three adjacent selectors. */
:is(#event-proposal-dialog,#request-create-dialog) .event-picker-panel select.grt-themed-select{
 padding:8px 28px 8px 8px;
 background-position:right 8px center;
 font-size:14px;
}
@supports(appearance:base-select){
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select,
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select::picker(select){appearance:base-select}
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select{display:flex;align-items:center}
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select>button{all:unset;display:contents}
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select selectedcontent{
  display:block;
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select::picker-icon{display:none}
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select:open{
  border-color:var(--blue,#2456ca);
  background-color:var(--select-hover);
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select::picker(select){
  inline-size:anchor-size(width);
  min-inline-size:min(180px,calc(100vw - 32px));
  max-inline-size:calc(100vw - 32px);
  max-block-size:min(320px,45dvh);
  margin-block:6px;
  padding:6px;
  border:1px solid var(--line,#dce3ed);
  border-radius:12px;
  background:var(--select-surface);
  color:var(--ink,#18243a);
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-color:var(--select-scrollbar) var(--select-hover);
  scrollbar-width:thin;
  font:inherit;
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:44px;
  padding:10px 12px;
  border:0;
  border-radius:6px;
  background:var(--select-surface);
  color:var(--ink,#18243a);
  font:inherit;
  font-weight:400;
  line-height:1.5;
  white-space:normal;
  overflow-wrap:anywhere;
  cursor:pointer;
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option:is(:hover,:focus,:checked){
  background:var(--select-tint);
  color:var(--select-active);
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option:checked{font-weight:600}
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option:focus-visible{
  outline:2px solid var(--select-focus);
  outline-offset:-2px;
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option[value=""]{color:var(--muted,#536279)}
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option:disabled{
  color:var(--muted,#536279);
  opacity:.6;
  cursor:not-allowed;
 }
 :is(body,#event-proposal-dialog,#request-create-dialog,#event-flyer-dialog,#event-cancel-dialog) select.grt-themed-select option::checkmark{
  order:1;
  margin-inline-start:auto;
  color:var(--blue,#2456ca);
  flex-shrink:0;
 }
}

@supports(appearance:base-select){
 :is(#event-proposal-dialog,#request-create-dialog,.phone-date-create) .event-picker-panel select.grt-themed-select::picker(select){min-inline-size:100px}
}