@import url('../lib/webawesome/styles/layers.css');

@layer wa-theme {
    .wa-theme-equipmentmove,
    .wa-theme-equipmentmove.wa-light,
    .wa-theme-equipmentmove .wa-light,
    .wa-theme-equipmentmove.wa-dark .wa-invert,
    .wa-theme-equipmentmove .wa-dark .wa-invert,
    .wa-light .wa-theme-equipmentmove,
    .wa-dark .wa-theme-equipmentmove.wa-invert,
    .wa-dark .wa-theme-equipmentmove .wa-invert {
        color-scheme: light;
        color: var(--wa-color-text-normal);

        --wa-color-brand-fill-quiet: var(--wa-color-brand-95);
        --wa-color-brand-fill-normal: var(--wa-color-brand-80);
        --wa-color-brand-fill-loud: var(--wa-color-brand-60);
        --wa-color-brand-border-quiet: var(--wa-color-brand-80);
        --wa-color-brand-border-normal: var(--wa-color-brand-60);
        --wa-color-brand-border-loud: var(--wa-color-brand-40);
        --wa-color-brand-on-quiet: var(--wa-color-brand-20);
        --wa-color-brand-on-normal: var(--wa-color-brand-10);
        --wa-color-brand-on-loud: var(--wa-color-brand-on);
        --wa-color-text-link: var(--wa-color-brand-20);
        --wa-color-focus: var(--wa-color-brand-20);
    }

    .wa-theme-equipmentmove.wa-dark,
    .wa-theme-equipmentmove .wa-dark,
    .wa-theme-equipmentmove.wa-invert,
    .wa-theme-equipmentmove .wa-invert,
    .wa-dark .wa-theme-equipmentmove,
    .wa-light .wa-theme-equipmentmove.wa-invert,
    .wa-light .wa-theme-equipmentmove .wa-invert {
        color-scheme: dark;
        color: var(--wa-color-text-normal);

        --wa-color-brand-fill-quiet: var(--wa-color-brand-10);
        --wa-color-brand-fill-normal: var(--wa-color-brand-20);
        --wa-color-brand-fill-loud: var(--wa-color-brand-50);
        --wa-color-brand-border-quiet: var(--wa-color-brand-20);
        --wa-color-brand-border-normal: var(--wa-color-brand-30);
        --wa-color-brand-border-loud: var(--wa-color-brand-40);
        --wa-color-brand-on-quiet: var(--wa-color-brand-60);
        --wa-color-brand-on-normal: var(--wa-color-brand-70);
        --wa-color-brand-on-loud: var(--wa-color-brand-on);
        --wa-color-text-link: var(--wa-color-brand-70);
        --wa-color-focus: var(--wa-color-brand-60);
    }

    .wa-theme-equipmentmove,
    .wa-theme-equipmentmove.wa-light,
    .wa-theme-equipmentmove .wa-light,
    .wa-theme-equipmentmove.wa-dark,
    .wa-theme-equipmentmove .wa-dark,
    .wa-theme-equipmentmove.wa-invert,
    .wa-theme-equipmentmove .wa-invert {
        font-family: var(--wa-font-family-body);

        --wa-color-brand-05: #2b1d00;
        --wa-color-brand-10: #4a3200;
        --wa-color-brand-20: #714b00;
        --wa-color-brand-30: #9a6800;
        --wa-color-brand-40: #c98600;
        --wa-color-brand-50: #f0a600;
        --wa-color-brand-60: #ffb400;
        --wa-color-brand-70: #ffc54d;
        --wa-color-brand-80: #ffd77f;
        --wa-color-brand-90: #ffebbd;
        --wa-color-brand-95: #fff5dc;
        --wa-color-brand: #ffb400;
        --wa-color-brand-on: #111418;

        --wa-font-family-body: "Inter", sans-serif;
        --wa-font-family-heading: "Graduate", serif;
        --wa-font-weight-heading: 400;

        --wa-form-control-background-color: transparent;
    }
}