@use '@angular/material' as mat;
$d2c-black-primary: mat.define-palette(mat.$grey-palette, 900);
$d2c-black-accent: mat.define-palette(mat.$amber-palette, 600);
$d2c-black-warn: mat.define-palette(mat.$red-palette, A200);

$d2c-black-theme: mat.define-dark-theme($d2c-black-primary, $d2c-black-accent, $d2c-black-warn);

@mixin black-gear-tags($theme) {
    $primary: map-get($theme, primary);
    $accent: map-get($theme, accent);

    .mat-input-element {
        caret-color: white;
    }

    mat-label {
        color: white;
    }

    .fake-link {
        color: #fff;
    }

    .fake-link:hover {
        color: #ffb300 !important;
    }


    .junk-color {
        color: hsl(0, 95%, 43%, 1);
        font-weight: bold;
    }

    .archive-color {
        color: 	rgb(134, 134, 134);
        font-weight: bold;
    }

    .mark-table>tbody>tr.upgrade>td,
    .mark-table>tbody>tr>td.upgrade {
        background-color: #303d4d;
    }


    .mark-table>tbody>tr.none>td,
    .mark-table>tbody>tr>td.none {
        background-color: #212121;
    }


    .mark-table>tbody>tr.keep>td,
    .mark-table>tbody>tr>td.keep {
        background-color: #344235;
    }

    .mark-table>tbody>tr.infuse>td,
    .mark-table>tbody>tr>td.infuse {
        background-color: #604532;
    }

    .mark-table>tbody>tr.junk>td,
    .mark-table>tbody>tr>td.junk {
        background-color: #553332;
    }

    .mark-table>tbody>tr.archive>td,
    .mark-table>tbody>tr>td.archive {
        background-color: #555555;
    }

    button.upgrade {
        background-color: #2c4674;
    }

    button.keep {
        background-color: #2c552d;
    }

    button.infuse {
        background-color: #9f5927;
    }

    button.junk {
        background-color: #84302f;
    }
    button.archive {
        background-color: #808080;
    }

    .nitro-consent-link button {
        color: mat.get-color-from-palette($primary, 300);

        &:hover {
            color: mat.get-color-from-palette($accent);
        }
    }

    .footer {
        color: mat.get-color-from-palette($primary, lighter);
        background-color: mat.get-color-from-palette($primary, 900);

        .links,
        .signature {
            color: mat.get-color-from-palette($primary, 400);

            a {
                color: mat.get-color-from-palette($primary, 300);

                &:hover {
                    color: mat.get-color-from-palette($accent);
                }
            }
        }
    }
}