/* Styled dropdowns for the whole LowCountry Schedule app (nice-select.js). The button looks like the other
   fields; the list is our own. Colours come from the page's own tokens (--navy, --blue, --ink, --muted, --line). */
.ns-wrap { position: relative; display: block; min-width: 0; }
.ns-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; font: inherit; font-size: 14.5px; color: var(--ink); background: #fff;
  border: 1.5px solid var(--line); border-radius: 11px; padding: 9px 12px; cursor: pointer; text-align: left; transition: border-color .15s, box-shadow .15s; }
.ns-btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ns-btn svg { width: 16px; height: 16px; flex: none; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .15s; }
.ns-btn:hover, .ns-btn[aria-expanded="true"] { border-color: var(--blue); }
.ns-btn[aria-expanded="true"] { box-shadow: 0 0 0 3px rgba(39,115,177,.15); }
.ns-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.ns-btn:focus-visible { outline: 3px solid var(--sky, #6FBED7); outline-offset: 2px; }
.ns-btn:disabled { opacity: .55; cursor: default; }
.ns-list { position: absolute; top: calc(100% + 6px); left: 0; min-width: 100%; width: max-content; max-width: min(360px, calc(100vw - 24px)); z-index: 60; margin: 0; padding: 6px;
  list-style: none; background: #fff; border: 1px solid #dfe5ea; border-radius: 14px; box-shadow: 0 16px 40px -10px rgba(18,33,46,.35); max-height: 300px; overflow: auto; outline: none; }
.ns-list.up { top: auto; bottom: calc(100% + 6px); }
.ns-list.right { left: auto; right: 0; }
.ns-list li { padding: 9px 12px; border-radius: 9px; font-size: 14.5px; font-weight: 500; color: var(--ink); cursor: pointer; white-space: nowrap; }
.ns-list li:hover, .ns-list li.at { background: #eef3f7; }
.ns-list li.on { font-weight: 700; color: var(--navy); }
.ns-list li.on::after { content: ''; display: inline-block; width: 6px; height: 10px; margin-left: 10px; border: solid var(--blue); border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); }
.ns-list li.off { color: #b6c1cb; cursor: default; background: none; }

/* The lanes calendar (?cal=a) toolbar. */
.cal-bar .ns-btn, .pool-sel .ns-btn { font-weight: 600; color: var(--navy); }

@media (max-width: 680px) {
  .ns-btn { font-size: 16px; min-height: 44px; }
  .ns-list li { padding: 12px 12px; font-size: 16px; }
}
