/* One dropdown treatment for filters, recipe tools and forms. */
.sprig-select,.sprig-select-menu {
  --select-surface:#fffef8;
  --select-border:#bdcdb7;
  --select-ink:#294634;
  --select-muted:#566e55;
  --select-hover:#edf2e6;
  --select-accent:#f4c69f;
  --select-accent-ink:#294634;
}
html[data-theme="dark"] :is(.sprig-select,.sprig-select-menu) {
  --select-surface:#263c30;
  --select-border:#587052;
  --select-ink:#edece0;
  --select-muted:#b1c1ac;
  --select-hover:#344d39;
  --select-accent:#efba91;
}
html[data-theme] :is(.recipe-reader .sprig-select,.sprig-select-menu.is-reader) {
  --select-surface:#fffef8;
  --select-border:#bdcdb7;
  --select-ink:#294634;
  --select-muted:#566e55;
  --select-hover:#edf2e6;
  --select-accent:#f4c69f;
}
.sprig-select {position:relative;display:inline-flex;vertical-align:middle;min-width:0;max-width:100%;flex:0 1 auto}
/* Keep the original value and change event for existing forms and controllers. */
body select.sprig-select-source {
  position:absolute!important;inset:0 auto auto 0!important;width:1px!important;height:1px!important;
  min-width:0!important;min-height:0!important;max-width:1px!important;padding:0!important;margin:0!important;
  border:0!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%);
}
body .sprig-select>.sprig-select-trigger {
  display:flex;align-items:center;justify-content:space-between;gap:13px;width:100%;min-width:0;max-width:100%;
  min-height:44px;padding:10px 12px;margin:0;border:1px solid var(--select-border);border-radius:11px;
  background:var(--select-surface);color:var(--select-ink);font:650 12px/1.45 var(--sans,system-ui,sans-serif);
  text-align:left;cursor:pointer;box-shadow:0 2px 6px #263f2805;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.sprig-select-value {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sprig-select-arrow {flex:0 0 16px;width:16px;height:16px;color:var(--select-muted);transition:transform .18s ease}
body .sprig-select>.sprig-select-trigger:hover:not(:disabled):not([aria-expanded="true"]) {border-color:#b98964;background:var(--select-hover)}
body .sprig-select>.sprig-select-trigger[aria-expanded="true"] {
  border-color:#b98964;background:var(--select-accent);color:var(--select-accent-ink);box-shadow:0 0 0 3px #edb78b26;
}
.sprig-select-trigger[aria-expanded="true"] .sprig-select-arrow {transform:rotate(180deg);color:var(--select-accent-ink)}
body .sprig-select>.sprig-select-trigger:disabled {opacity:.55;cursor:not-allowed}
.sprig-select-menu {
  position:fixed;z-index:10000;padding:6px;border:1px solid var(--select-border);border-radius:14px;
  background:var(--select-surface);color:var(--select-ink);box-shadow:0 16px 40px #102d2329,0 4px 10px #102d2310;
  overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--select-border) transparent;
  max-width:calc(100vw - 24px);max-height:min(320px,calc(100dvh - 24px));isolation:isolate;
  font:500 13px/1.45 var(--sans,system-ui,sans-serif);animation:sprig-menu-in .14s ease both;
}
.sprig-select-menu .sprig-select-option {
  display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;width:100%;
  padding:11px 12px;border:0;border-radius:8px;background:transparent;color:var(--select-ink);
  font:inherit;text-align:left;white-space:normal;overflow-wrap:anywhere;cursor:pointer;
}
.sprig-select-menu .sprig-select-option:hover,.sprig-select-menu .sprig-select-option.is-active {
  background:var(--select-hover);color:var(--select-ink);
}
.sprig-select-menu .sprig-select-option[aria-selected="true"] {
  background:var(--select-accent);color:var(--select-accent-ink);font-weight:700;
}
.sprig-select-menu .sprig-select-option[aria-disabled="true"] {opacity:.45;cursor:not-allowed}
.sprig-select-check {display:grid;place-items:center;flex:0 0 18px;width:18px;height:18px;margin-left:auto}
.sprig-select-check svg {width:16px;height:16px}
.sprig-select-group {padding:12px 12px 5px;font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--select-muted)}
.sprig-select-empty {padding:14px 12px;color:var(--select-muted);font-size:12px}
/* Fit each control to its existing page layout. */
.discover-sort .sprig-select {width:160px}
.pantry-sort .sprig-select {width:230px}
.cooks-sort-label .sprig-select {width:200px;flex:1}
.lab-sort-label .sprig-select {width:220px}
.atlas-generations .sprig-select {width:190px}
:is(.field,.atlas-field,.living-note-label,.showdown-picker,.cookbook-cover-fields,.cooks-filter-row) .sprig-select {
  display:flex;width:100%;
}
.cookbook-category>.sprig-select {display:flex;flex:1;min-width:0}
.living-note-label>.sprig-select,.showdown-picker>.sprig-select {margin-top:7px}
.reader-toolbar .sprig-select {width:88px}
@keyframes sprig-menu-in {from{opacity:0}to{opacity:1}}
@media(max-width:720px) {
  .pantry-sort .sprig-select {flex:1;width:auto}
  .discover-sort .sprig-select {width:155px}
  .atlas-generations .sprig-select {width:155px}
  .lab-sort-label .sprig-select {width:min(220px,100%)}
  .sprig-select-menu {font-size:14px}
  .sprig-select-menu .sprig-select-option {min-height:46px}
}
@media(prefers-reduced-motion:reduce) {
  .sprig-select-menu {animation:none}
  body .sprig-select>.sprig-select-trigger,.sprig-select-arrow {transition:none}
}
@media(print) {.sprig-select-menu{display:none!important}}