/* Lista w stylu Tamiso zamiast systemowej (wariant B z podglądu wybor-uzasadnienia.html), dla każdego <select>:
   strona, aplikacja i panel admina (dropdown.js). Wspólny plik, bo panel ma własny arkusz. */
.dd { position: relative; max-width: 520px; }
.dd select { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.dd-btn { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 12px; font: 500 14px var(--sans); text-align: left; color: var(--ink); background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; cursor: pointer; }
.dd-btn:hover { border-color: #C9C9D3; }
.dd-btn[aria-expanded="true"] { border-color: var(--ink); }
.dd-btn .ph { color: var(--ink-3); }
.dd-btn svg { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dd-list { position: fixed; z-index: 75; margin: 0; padding: 6px; list-style: none; background: #040403; color: #FFFFFF; border: 1px solid #26262C; border-radius: 14px;  /* menu zawsze czarne, w obu motywach */ display: grid; gap: 2px; max-height: min(360px, 60vh); overflow-y: auto; box-sizing: border-box; }
.dd-list[hidden] { display: none; }
.dd-list:focus { outline: none; }
.dd-list li { position: relative; padding: 9px 10px 9px 34px; border-radius: 10px; font-size: 14px; line-height: 1.35; cursor: pointer; }
.dd-list li small { display: block; color: #8D8D96; font-size: 12px; margin-top: 2px; }
.dd-list li.active { background: #1E1E23; }
.dd-list li[aria-selected="true"]::before { content: ""; position: absolute; left: 12px; top: 13px; width: 10px; height: 6px; border-left: 2px solid #6FD07D; border-bottom: 2px solid #6FD07D; transform: rotate(-45deg); }
.dd-list:focus-visible li.active { outline: 2px solid var(--green); outline-offset: -2px; }
/* select z klasą .input: przycisk jak pole formularza, na całą szerokość; .dd-dark: ciemne menu boczne */
.dd-input { max-width: none; }
.dd-input .dd-btn { font-size: 15px; padding: 12px 14px; }
.dd-dark .dd-btn { background: #0F0F12; color: #FFFFFF; border-color: #26262C; font-weight: 600; padding: 9px 10px; }
.dd-dark .dd-btn:hover { border-color: #3A3A42; }
.dd-dark .dd-btn[aria-expanded="true"] { border-color: #FFFFFF; }
.dd-btn:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.dd-btn:disabled { opacity: .55; cursor: not-allowed; }
@media (prefers-reduced-motion: no-preference) {
  .dd-btn svg { transition: transform 160ms ease; }
  .dd-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
  .dd-list:not([hidden]) { animation: ddIn 160ms cubic-bezier(.2,.8,.2,1); }
  .dd-list.up:not([hidden]) { animation-name: ddUp; }
  @keyframes ddIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
  @keyframes ddUp { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
}