/* ==========================================================
   THE STUDIO — BUILD 11.8
   POLISH & CONSISTENCY
   ========================================================== */

:root {
    --studio-content-width: 1380px;
    --studio-module-padding-x: clamp(24px, 3vw, 40px);
    --studio-module-padding-bottom: 50px;
    --studio-premium-border: rgba(200, 167, 101, 0.16);
    --studio-premium-border-hover: rgba(200, 167, 101, 0.28);
    --studio-premium-radius: 22px;
    --studio-premium-shadow: 0 22px 58px rgba(0, 0, 0, 0.29);
    --studio-premium-shadow-hover: 0 27px 68px rgba(0, 0, 0, 0.35);
    --studio-focus-ring: 0 0 0 3px rgba(200, 167, 101, 0.16);
}

/* Consistent keyboard focus throughout the desktop application. */
:where(
    button,
    input,
    textarea,
    select,
    [tabindex]:not([tabindex="-1"])
):focus-visible {
    outline: 1px solid var(--studio-accent-hover);
    outline-offset: 3px;
    box-shadow: var(--studio-focus-ring);
}

/* Keep form controls and buttons visually quiet and predictable. */
button,
input,
textarea,
select {
    accent-color: var(--studio-accent);
}

button:not(:disabled) {
    -webkit-tap-highlight-color: transparent;
}

button:disabled,
[aria-disabled="true"] {
    cursor: not-allowed;
}

/* Shared content rhythm for the completed Build 11 modules. */
.dashboard-view,
.songs-view,
.live-room,
.setlist-workspace,
.rehearsals-view > *,
.settings-view > * {
    max-width: var(--studio-content-width);
}

/* Shared premium motion: subtle, never springy. */
.dashboard-card,
.song-results-panel,
.song-row,
.setlist-card,
.live-room .panel,
.rehearsal-panel,
.settings-panel {
    transition-duration: 180ms;
    transition-timing-function: ease;
}

/* Align the two full-canvas modules with the established module spacing. */
body:has(.rehearsals-view) > .studio-app > .workspace > #workspace-content,
body:has(.settings-view) > .studio-app > .workspace > #workspace-content {
    padding-right: var(--studio-module-padding-x);
    padding-bottom: var(--studio-module-padding-bottom);
    padding-left: var(--studio-module-padding-x);
}

/* Consistent premium panel edge and hover treatment. */
.rehearsal-panel,
.settings-panel {
    border-color: var(--studio-premium-border);
    border-radius: var(--studio-premium-radius);
    box-shadow:
        var(--studio-premium-shadow),
        inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

.rehearsal-panel:hover,
.settings-panel:hover {
    border-color: var(--studio-premium-border-hover);
    box-shadow:
        var(--studio-premium-shadow-hover),
        inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

/* Unified eyebrow treatment across the Build 11 modules. */
.dashboard-kicker,
.songs-toolbar-copy .eyebrow,
.live-room__header .eyebrow,
.rehearsals-kicker,
.rehearsal-panel-label,
.settings-kicker,
.settings-panel-label {
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

/* Prevent long labels and metadata from disturbing cards. */
.song-row,
.setlist-card,
.rehearsal-panel,
.settings-panel,
.settings-status-row,
.rehearsal-session-meta > * {
    min-width: 0;
}

.song-row :where(h3, p, span),
.setlist-card :where(h2, h3, p, span),
.rehearsal-panel :where(h3, p, span),
.settings-panel :where(h3, p, span) {
    overflow-wrap: anywhere;
}

/* Refined native scrollbars in Chromium/WebKit without affecting Firefox. */
.workspace-content::-webkit-scrollbar-thumb,
.song-list::-webkit-scrollbar-thumb,
.setlist-workspace::-webkit-scrollbar-thumb {
    border: 3px solid transparent;
    border-radius: 999px;
    background: rgba(200, 167, 101, 0.3);
    background-clip: padding-box;
}

.workspace-content::-webkit-scrollbar-thumb:hover,
.song-list::-webkit-scrollbar-thumb:hover,
.setlist-workspace::-webkit-scrollbar-thumb:hover {
    background: rgba(200, 167, 101, 0.48);
    background-clip: padding-box;
}

@media (max-width: 900px) {
    :root {
        --studio-module-padding-x: 22px;
        --studio-module-padding-bottom: 36px;
    }
}

@media (max-width: 640px) {
    :root {
        --studio-module-padding-x: 16px;
        --studio-module-padding-bottom: 28px;
    }

    .rehearsal-panel,
    .settings-panel {
        border-radius: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ==========================================================
   BUILD 15.17 — RESPONSIVE & QUALITY SWEEP
   Targeted presentation overrides only.
   ========================================================== */

:where(.studio-button, .primary-button, .secondary-button, .button-primary, .button-secondary, .button-text) {
    max-width: 100%;
}

:where(input, select, textarea) {
    max-width: 100%;
}

:where(.library-dialog, .members-dialog, .member-profile-dialog, .member-contact-dialog, .studio-dialog) {
    max-width: calc(100vw - 24px);
    max-height: min(90dvh, 900px);
}

:where(.library-card, .member-card, .rehearsal-panel, .setlist-card, .settings-panel) :where(h1, h2, h3, h4, p, span, strong, a, dd) {
    overflow-wrap: anywhere;
}

@media (max-width: 760px) {
    body {
        overflow-x: hidden;
    }

    .studio-app {
        min-height: 100dvh;
    }

    .workspace {
        min-width: 0;
        min-height: calc(100dvh - 72px);
    }

    .topbar {
        min-height: 88px;
        padding: 18px 16px;
    }

    .topbar h1 {
        max-width: calc(100vw - 150px);
        font-size: clamp(1.55rem, 8vw, 2rem);
    }

    .topbar-actions {
        gap: 8px;
    }

    .profile-button {
        width: 40px;
        height: 40px;
    }

    .session-actions {
        position: static;
        width: calc(100% - 32px);
        max-width: none;
        margin: 12px 16px 0;
        border-radius: 14px;
    }

    .session-user-context {
        max-width: none;
        flex: 1 1 auto;
    }

    .logout-button {
        min-height: 44px;
    }

    .workspace-content,
    body:has(.rehearsals-view) > .studio-app > .workspace > #workspace-content,
    body:has(.settings-view) > .studio-app > .workspace > #workspace-content {
        width: 100%;
        min-width: 0;
        overflow: visible;
        padding: 18px 16px 28px;
    }

    body.dashboard-route .workspace-content {
        padding-top: 14px;
    }

    .workspace-tabs {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-inline: contain;
        scrollbar-width: thin;
    }

    .workspace-tab-button {
        flex: 0 0 auto;
        min-height: 44px;
    }

    .library-results,
    .member-grid,
    .setlist-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .library-card {
        grid-template-columns: 44px minmax(0, 1fr);
        padding: .9rem;
    }

    .library-file-icon {
        width: 44px;
        height: 44px;
    }

    .library-card-heading,
    .library-card dl div {
        align-items: flex-start;
        flex-direction: column;
    }

    .library-card dd {
        text-align: left;
    }

    .library-card-actions,
    .member-card-actions,
    .member-profile-actions,
    .library-dialog-actions {
        align-items: stretch;
    }

    .library-card-actions > *,
    .member-card-actions > *,
    .member-profile-actions > *,
    .library-dialog-actions > * {
        min-height: 44px;
    }

    .members-dialog,
    .member-profile-dialog,
    .member-contact-dialog,
    .library-dialog,
    .studio-dialog {
        width: calc(100vw - 24px);
        max-height: calc(100dvh - 24px);
        margin: 12px;
    }

    .studio-dialog-backdrop {
        align-items: start;
        overflow-y: auto;
        padding: 12px;
    }

    .members-dialog > header,
    .members-dialog footer,
    .member-profile-header,
    .member-profile-identity {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .member-card-main {
        gap: .75rem;
    }

    .member-avatar-large {
        width: 72px;
        height: 72px;
    }

    .member-details {
        grid-template-columns: 1fr;
        gap: .2rem;
    }

    .member-details dd {
        margin-bottom: .55rem;
    }

    .rehearsals-view,
    .settings-view {
        padding: 18px 0;
        overflow: visible;
    }

    .rehearsals-hero,
    .settings-hero {
        align-items: flex-start;
        flex-direction: column;
        margin-bottom: 18px;
    }

    .rehearsals-layout,
    .settings-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .rehearsal-board,
    .settings-modules-panel {
        grid-column: auto;
    }

    .rehearsal-session-meta {
        grid-template-columns: 1fr;
    }

    .rehearsal-session-meta strong {
        white-space: normal;
    }

    .rehearsal-session-time {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        margin: 26px 0 24px;
    }

    .rehearsal-session-time strong {
        font-size: clamp(2.7rem, 16vw, 4.2rem);
    }

    .settings-data-list > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .settings-data-list dd,
    .settings-status-list dd {
        text-align: left;
    }

    .settings-module-row div span {
        white-space: normal;
    }
}

@media (max-width: 520px) {
    .topbar h1 {
        max-width: calc(100vw - 100px);
    }

    .library-hero,
    .members-hero,
    .rehearsal-panel,
    .settings-panel,
    .setlist-card {
        border-radius: 14px;
    }

    .library-toolbar,
    .members-toolbar {
        grid-template-columns: minmax(0, 1fr);
    }

    .library-card-actions,
    .library-admin-actions,
    .member-card-actions,
    .member-profile-actions,
    .library-dialog-actions {
        flex-direction: column;
    }

    .library-card-actions > *,
    .library-admin-actions > *,
    .member-card-actions > *,
    .member-profile-actions > *,
    .library-dialog-actions > * {
        width: 100%;
    }

    .song-hero__action,
    .song-workspace-view .button-primary,
    .song-workspace-view .button-secondary {
        min-height: 44px;
    }
}
