/* Shared dropdown component for release upload and edit forms. */
.release-dropdown { position:relative; width:100%; min-width:0; font-size:14px; }
.release-dropdown--compact { width:10rem; min-width:10rem; flex:0 0 10rem; }
.author-row > .release-dropdown--compact { width:15rem; min-width:15rem; flex:0 0 15rem; }
.release-dropdown__source { position:absolute !important; width:1px !important; height:1px !important; margin:-1px !important; padding:0 !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; clip-path:inset(50%) !important; white-space:nowrap !important; border:0 !important; }
.release-dropdown__trigger { position:relative; display:flex; align-items:center; width:100%; min-height:46px; padding:12px 44px 12px 16px; overflow:hidden; color:#e4e4e7; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.14); border-radius:12px; font:inherit; line-height:1.35; text-align:left; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease; }
.release-dropdown__value { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.release-dropdown__trigger:hover { background:rgba(209,0,96,.07); border-color:rgba(209,0,96,.55); }
.release-dropdown__trigger:focus-visible { outline:none; border-color:#d10060; box-shadow:0 0 0 3px rgba(209,0,96,.28); }
.release-dropdown.is-open .release-dropdown__trigger { background:rgba(209,0,96,.1); border-color:rgba(209,0,96,.72); box-shadow:0 0 0 3px rgba(209,0,96,.16); }
.release-dropdown__chevron { position:absolute; top:50%; right:15px; width:18px; height:18px; pointer-events:none; transform:translateY(-50%); transition:transform .18s ease; }
.release-dropdown__chevron::before { position:absolute; top:4px; left:4px; width:8px; height:8px; content:""; border-right:2px solid #a1a1aa; border-bottom:2px solid #a1a1aa; border-radius:2px; transform:rotate(45deg); }
.release-dropdown.is-open .release-dropdown__chevron { transform:translateY(-50%) rotate(180deg); }
.release-dropdown__menu { position:absolute; top:calc(100% + 4px); right:0; left:0; z-index:100; display:flex; flex-direction:column; align-items:stretch; gap:4px; max-height:min(340px,calc(100vh - 24px)); padding:4px; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; color:#e4e4e7; background:#1c1c21; border:1px solid rgba(255,255,255,.16); border-radius:12px; box-shadow:0 14px 32px rgba(0,0,0,.32); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-6px); transform-origin:top; transition:opacity .18s ease,transform .18s ease,visibility .18s step-end; }
.release-dropdown.is-open .release-dropdown__menu { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); transition:opacity .18s ease,transform .18s ease; }
.release-dropdown--up .release-dropdown__menu { top:auto; bottom:calc(100% + 4px); transform:translateY(6px); transform-origin:bottom; }
.release-dropdown--up.is-open .release-dropdown__menu { transform:translateY(0); }
.release-dropdown__option { position:relative; display:flex; flex:0 0 auto; align-items:center; width:100%; min-height:44px; padding:10px 38px 10px 12px; overflow:hidden; color:inherit; background:transparent; border:0; border-radius:8px; font:inherit; line-height:1.35; text-align:left; white-space:normal; overflow-wrap:anywhere; cursor:pointer; transition:background-color .14s ease,color .14s ease; }
/* The component needs flex layout for visible options, but that declaration
   otherwise overrides the browser's [hidden] rule used by the live search. */
.release-dropdown__option[hidden] { display:none !important; }
.release-dropdown__option:hover,.release-dropdown__option:focus-visible { outline:none; background:rgba(255,255,255,.08); }
.release-dropdown__option[aria-selected="true"] { color:#fbcfe8; background:rgba(209,0,96,.16); }
.release-dropdown__option[aria-selected="true"]::after { position:absolute; top:50%; right:15px; width:10px; height:6px; content:''; border-bottom:3px solid #f9a8d4; border-left:3px solid #f9a8d4; border-radius:1px; transform:translateY(-65%) rotate(-45deg); }
.release-dropdown__option[aria-disabled="true"] { opacity:.45; cursor:not-allowed; }
.release-dropdown__option-source { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.release-dropdown.is-invalid .release-dropdown__trigger { border-color:#d10060; box-shadow:0 0 0 3px rgba(209,0,96,.24); }

/* Поиск применяется только там, где он явно включён атрибутом data-release-dropdown-search. */
.release-dropdown--searchable .release-dropdown__menu { gap:8px; padding:8px; }
.release-dropdown__search { position:sticky; top:0; z-index:1; padding-bottom:2px; background:#1c1c21; }
.release-dropdown__search-input { width:100%; min-height:42px; padding:10px 12px; color:#e4e4e7; background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.16); border-radius:9px; font:inherit; line-height:1.3; }
.release-dropdown__search-input::placeholder { color:#a1a1aa; opacity:1; }
.release-dropdown__search-input:focus { outline:none; border-color:#d10060; box-shadow:0 0 0 3px rgba(209,0,96,.16); }
.release-dropdown__options { display:flex; flex-direction:column; align-items:stretch; gap:4px; min-width:0; }
.release-dropdown__empty { margin:4px 0 2px; padding:10px 12px; color:#a1a1aa; font-size:13px; line-height:1.35; text-align:center; }

html.theme-light .release-dropdown__trigger { color:#27272a; background:#fff; border-color:rgba(0,0,0,.15); }
html.theme-light .release-dropdown__trigger:hover { background:#fff7fa; border-color:#ec4899; }
html.theme-light .release-dropdown.is-open .release-dropdown__trigger { background:#fff; border-color:#ec4899; box-shadow:0 0 0 3px rgba(190,24,93,.14); }
html.theme-light .release-dropdown__menu { color:#27272a; background:#fff; border-color:rgba(0,0,0,.14); box-shadow:0 14px 30px rgba(0,0,0,.12); }
html.theme-light .release-dropdown__option:hover,
html.theme-light .release-dropdown__option:focus-visible { background:#fff3f8; }
html.theme-light .release-dropdown__option[aria-selected="true"] { color:#9f1239; background:#ffe4f0; }
html.theme-light .release-dropdown__option[aria-selected="true"]::after { border-color:#9f1239; }
html.theme-light .release-dropdown__search { background:#fff; }
html.theme-light .release-dropdown__search-input { color:#27272a; background:#fff7fa; border-color:rgba(0,0,0,.14); }
html.theme-light .release-dropdown__search-input::placeholder,
html.theme-light .release-dropdown__empty { color:#71717a; }

@media (max-width:640px) {
    .author-row,
    .release-artist-row,
    .track-artist-row,
    .performer-row { flex-wrap:wrap; }

    .author-row > .form-input,
    .release-artist-row > input.form-input,
    .track-artist-row > input.form-input {
        flex:1 0 100%;
        width:100%;
    }

    .author-row > .release-dropdown--compact {
        width:100%;
        min-width:0;
        flex:1 1 100%;
    }

    /* Имя исполнителя — самостоятельная полная строка. Роль находится ниже;
       у добавленных строк рядом остаётся только компактное действие удаления. */
    .release-artist-row > .release-dropdown--compact,
    .track-artist-row > .release-dropdown--compact,
    .performer-row > .release-dropdown--compact {
        width:100%;
        min-width:0;
        flex:1 1 100%;
    }

    .release-artist-row:has(> button) > .release-dropdown--compact,
    .track-artist-row:has(> button) > .release-dropdown--compact,
    .performer-row:has(> button) > .release-dropdown--compact {
        width:auto;
        flex:1 1 0;
    }

    .release-artist-row > button,
    .track-artist-row > button,
    .performer-row > button {
        flex:0 0 44px;
        min-width:44px;
        min-height:44px;
        padding:0 !important;
        display:inline-flex;
        align-items:center;
        justify-content:center;
    }

    .release-dropdown--compact { width:100%; min-width:0; flex:1 1 100%; }
    .release-dropdown__menu { max-height:min(300px,calc(100vh - 20px)); }
}