/* public/app/css/dash-erase-btn.css
 * Synopsis: Bouton effacer mot dans Clavier.
 * Objectif: Action utile visible, distincte d’Annuler.
 */

.dash .dash-panel--keyboard .dash-act--erase {
    background: color-mix(in srgb, var(--dash-accent) 14%, var(--dash-elev2));
    border-color: color-mix(in srgb, var(--dash-accent) 38%, var(--dash-line));
    color: color-mix(in srgb, var(--dash-accent) 78%, var(--dash-text));
    font-weight: 600;
    transition: none;
}

.dash .dash-panel--keyboard .dash-act--erase:hover:not(:disabled) {
    background: color-mix(in srgb, var(--dash-accent) 24%, var(--dash-elev2));
    border-color: color-mix(in srgb, var(--dash-accent) 55%, var(--dash-line));
    color: color-mix(in srgb, var(--dash-accent) 92%, var(--dash-text));
}

html[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) 72%, var(--dash-text));
}

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