/* public/app/css/dash-accent-soft-non-noir.css
 * Synopsis: Adoucissement accents dashboard hors thème noir.
 * Objectif: Réduire les pics de brillance des états actifs.
 */

html:not([data-vok-theme="noir"]) .dash .dash-go.primary,
html:not([data-vok-theme="noir"]) .dash .dash-go {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--dash-accent) 74%, var(--dash-elev2)),
        color-mix(in srgb, var(--dash-accent) 52%, var(--dash-elev2))
    );
    color: color-mix(in srgb, var(--dash-text) 84%, #0a1814);
    font-weight: 500;
}

html:not([data-vok-theme="noir"]) .dash .dash-core .dash-go,
html:not([data-vok-theme="noir"]) .dash .dash-core .dash-act--audio,
html:not([data-vok-theme="noir"]) .dash .dash-core .dash-act {
    font-size: .82rem;
    font-weight: 500;
    letter-spacing: 0;
    min-height: 2.35rem;
    padding: .42rem .34rem;
}

html:not([data-vok-theme="noir"]) .dash .dash-go.primary:hover,
html:not([data-vok-theme="noir"]) .dash .dash-go:hover:not(:disabled) {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--dash-accent) 62%, var(--dash-text)),
        color-mix(in srgb, var(--dash-accent) 78%, var(--dash-elev2))
    );
}

html:not([data-vok-theme="noir"]) .dash #stt-load-fill {
    background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--dash-accent) 68%, var(--dash-elev2)),
        color-mix(in srgb, var(--dash-accent) 46%, var(--dash-elev2))
    );
}

html:not([data-vok-theme="noir"]) .dash .dash-seg-btn[aria-pressed="true"],
html:not([data-vok-theme="noir"]) .dash .dash-mode[aria-selected="true"] {
    background: color-mix(in srgb, var(--dash-accent) 58%, var(--dash-elev2));
    border-color: color-mix(in srgb, var(--dash-accent) 22%, var(--dash-line));
    color: color-mix(in srgb, var(--dash-text) 82%, var(--dash-accent));
    font-weight: 500;
}

html:not([data-vok-theme="noir"]) .dash .dash-go[aria-pressed="true"] {
    color: color-mix(in srgb, var(--dash-text) 90%, #fff);
    font-size: clamp(1.02rem, 2vw, 1.22rem);
    min-height: 3rem;
}

html:not([data-vok-theme="noir"]) .dash .dash-status[data-kind="listening"] {
    background: color-mix(in srgb, var(--dash-accent) 8%, transparent);
    border-color: color-mix(in srgb, var(--dash-accent) 24%, transparent);
    color: color-mix(in srgb, var(--dash-accent) 58%, var(--dash-text));
    font-weight: 500;
}

html:not([data-vok-theme="noir"]) .dash .dash-panel--keyboard .dash-act--erase {
    background: color-mix(in srgb, var(--dash-accent) 12%, var(--dash-elev2));
    border-color: color-mix(in srgb, var(--dash-accent) 32%, var(--dash-line));
    color: color-mix(in srgb, var(--dash-accent) 68%, var(--dash-text));
    font-weight: 500;
}

html:not([data-vok-theme="noir"]) .dash .dash-panel--keyboard .dash-act--erase:hover:not(:disabled) {
    background: color-mix(in srgb, var(--dash-accent) 20%, var(--dash-elev2));
    border-color: color-mix(in srgb, var(--dash-accent) 48%, var(--dash-line));
    color: color-mix(in srgb, var(--dash-accent) 88%, var(--dash-text));
}

html:not([data-vok-theme="noir"]) .dash .dash-source-pick[aria-pressed="true"]::after {
    background: color-mix(in srgb, var(--dash-accent) 72%, var(--dash-muted));
    box-shadow: 0 0 5px color-mix(in srgb, var(--dash-accent) 24%, transparent);
}