/*
colors (vscolor)
 */

:root {
    --vsbase-font-size: 16px;

    /*primary-colors*/
    --vscolor-primary-black: #000000;
    --vscolor-primary-dark-gray: #262626;
    --vscolor-primary-red: #D52826;
    --vscolor-primary-light-gray: #F3F3F2;
    --vscolor-primary-gray: #AAAAAA;

    /*primary-hover-colors*/
    --vscolor-primary-hover-dark-gray: #0c0c0c;
    --vscolor-primary-hover-red: #AA201E;
    --vscolor-primary-hover-light-gray: #dbdbd7;

    /*additional*/
    --vscolor-bright-green: #d4edda;
    --vscolor-green: #008000;
    --vscolor-dark-green:#004d00;
    --vscolor-bright-blue:#d1ecf1;
    --vscolor-blue: #17a2b8;
    --vscolor-dark-blue: #117a8b;
    --vscolor-bright-orange:#fff3cd;
    --vscolor-orange:#ffc107;
    --vscolor-dark-orange:#d39e00;
    --vscolor-bright-red:#f0d1cf;
    --vscolor-red: #ffd5d5;
    --vscolor-dark-red:#ffa2a2;

    /*message background*/
    --vscolor-bg-success-message: var(--vscolor-bright-green);
    --vscolor-bg-info-message: var(--vscolor-bright-blue);
    --vscolor-bg-warn-message: var(--vscolor-bright-orange);
    --vscolor-bg-danger-message: var(--vscolor-bright-red);

    /*btn*/
    --vscolor-btn-default: var(--vscolor-primary-light-gray);
    --vscolor-btn-cancel: var(--vscolor-primary-red);
    --vscolor-btn-next: var(--vscolor-primary-dark-gray);
    --vscolor-btn-submit: var(--vscolor-green);


    /*headings*/
    --vstypo-heading-font-weight: 600;
    --vstypo-heading-line-height: 1.2;
    --vstypo-lead-font-weight: 300;
    --vstypo-lead-font-size: 1.2rem;
}