:root {
    --logo-width: 240px;
    --logo-height: auto;

    /* standard colors */
    /* used for buttons */
    --primary: #0B5C47;
    --primary-lighter: #0B5C47;

    /* used for text fields labels and icons */
    --primary-variant: var(--primary);

    /* used for links on the page */
    --secondary: #4d8210;
    --secondary-lighter: #4d8210;
    --accent: #2638c4;

    --show-hide-password-color: var(--accent);

    /* this overwrites the --fog color from pbs.org */
    --fog: #f6f6f6;
}

/* LIGHT MODE */
body {
    --font-style: 'sans-serif';

    --bkg-color: #f6f6f6;
    --frg-color: #f2f2f2;

    background-color: var(--bkg-color);

    --text-color: #040613;

    --footer-bkg-color: var(--bkg-color);
    --text-footer-color: var(--text-color);

    --header-color: var(--primary-variant);
    --header-hover-color: var(--primary-variant);

    --label-color: var(--primary-variant);
    --link-color: var(--secondary-lighter);
    --link-hover-color: var(--secondary);

    --button-fill-text-color: var(--white);

    --button-fill-bkg-color: var(--primary-lighter);
    --button-fill-bkg-active-color: var(--primary);
    --button-fill-bkg-hover-color: var(--primary);

    --button-fill-border-color: var(--primary-lighter);
    --button-fill-border-hover-color: var(--primary);
    --button-fill-border-active-color: var(--primary);

    --button-no-fill-bkg-color: transparent;
    --button-no-fill-bkg-active-color: var(--primary);
    --button-no-fill-bkg-hover-color: var(--primary);

    --button-no-fill-border-color: var(--primary-lighter);
    --button-no-fill-border-hover-color: var(--primary);
    --button-no-fill-border-active-color: var(--primary);

    --button-no-fill-text-color: var(--primary-lighter);
    --button-no-fill-text-active-color: var(--fog);
    --button-no-fill-text-hover-color: var(--fog);

    --icon-external-link: url("../img/external_link_icon.svg");
    --icon-email: url("../img/email_icon.svg");
    --icon-user: url("../img/user_icon.svg");
    --icon-badge: url("../img/badge_icon.svg");
    --icon-lock: url("../img/lock_icon.svg");
    --icon-arrow-right: url("../img/arrow_right.svg");
    --icon-arrow-right-text: url("../img/arrow_right_text.svg");
    --icon-pencil: url("../img/pencil_icon.svg");
    --icon-collapse: url("../img/collapse_icon.svg");

    --checkmark-color: var(--primary);
    --container-color: var(--frg-color);

    --wrapper-color: var(--bkg-color);

    --button-border-radius: 30px;

    /* this overwrites some colors that are used on pbs.org according to documentation:
    https://docs.pbs.org/space/PMSSO/51118083/Branding+Customizations */
    /* Warning text: */
    --text-error-color: #fe704e;

    /* colors used for 'Confirmation Text': */
    --success-text-color: var(--accent);
    --verified-color: var(--accent);
}

.content-wrapper .help-text, .footer-container .help-text {
    color: var(--text-color);
}

form input,
#secondFactorCodeChangeEmailInput,
#secondFactorCodeLoginInput,
#secondFactorCodeRegistrationInput,
#changeEmailInput {
    border-radius: 8px;
}
