/* MudBlazor now owns the portal's look (#220): its stylesheet ships the reset, typography, tables,
   buttons, chips and layout. All that remains here is the static-SSR login form — its fields must be
   native named inputs (a MudTextField would not serialise into the form POST), so they need this small
   bit of styling MudBlazor's component CSS doesn't reach. */

.admin-login {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.admin-login label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.9rem;
}

.admin-login input {
    padding: 0.5rem;
    font: inherit;
    border: 1px solid var(--mud-palette-lines-inputs, #ccc);
    border-radius: 4px;
}

/* #569 — the ▶ / ❚❚ button that plays a Bangerz song's iTunes preview (wwwroot/js/preview-player.js). A plain
   button with a native onclick, so it is styled here rather than by MudBlazor. */
.preview-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--mud-palette-primary, #594ae2);
    background: transparent;
    color: var(--mud-palette-primary, #594ae2);
    cursor: pointer;
    font-size: 0.8rem;
    line-height: 1;
    padding: 0;
    flex: none;
}

.preview-btn::before {
    content: "▶";
}

.preview-btn.playing {
    background: var(--mud-palette-primary, #594ae2);
    color: var(--mud-palette-primary-text, #fff);
}

.preview-btn.playing::before {
    content: "❚❚";
}

.preview-btn.failed {
    border-color: var(--mud-palette-error, #f44336);
    color: var(--mud-palette-error, #f44336);
}

.preview-btn:disabled {
    opacity: 0.35;
    cursor: default;
}

.song-art {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}