:root
{
    /* ===============================================
    COLORS
    ================================================== */
    /*
    #theme-body
    */
    --body-color:                         #222222;
    --body-color-white:                   #ffffff;
    --body-color-inactive:                #afafaf;
    
    --body-color-title:                   #232323;
    --body-color-subtitle:                #626273;
    
    --body-background:                    #ffffff;
    --body-background-white:              #ffffff;
    --body-background-blur:               rgba(255, 255, 255, 0.5);
    
    --body-sub-background:                #ebebeb;
    --body-sub-background-hover:          #e1e1e2;
    --body-sub-background-active:         #fcfcfc;
    
    --body-account-background:            #f7f7f8;
    --body-section-background:            #f7f7f8;

    --body-scrollbar-background:          #f7f7f8;
    --body-progress-bar-background:       #f7f7f8;
    
    --body-border:                        #e5e5e5;
    --body-border-white:                  #ffffff;
    --body-border-blur:                   rgba(225, 225, 225, 0.35);
    
    --body-sub-border:                    #e5e5e5;
    
    --body-form-placeholder:              #afafaf;
    --body-form-border:                   #afafaf;
    --body-form-icon:                     #afafaf;
    
    --body-shadow:                        0rem 0.2rem 0.8rem -0.1rem rgba(0, 0, 0, 0.1), 0rem 0.1rem 0.1rem 0rem rgba(0, 0, 0, 0.1), 0rem 0.1rem 0.3rem 0rem rgba(0, 0, 0, 0.1);
    
    /*
    #highlights
    */
    --highlights-yellow:                  #ffff99;
    --highlights-red:                     #fff6f6;
    
    /*
    #color
    */
    --color-whatsapp:                     #25D366;
    --color-whatsapp-hover:               #43E07D;
    --color-whatsapp-active:              #4AED86;

    --color-blue:                         #178cf3;
    --color-blue-hover:                   #31a6ff;
    --color-blue-active:                  #4abfff;

    --color-green:                        #86c540;
    --color-green-hover:                  #8dd43f;
    --color-green-active:                 #93ec31;

    --color-yellow:                       #f8ba10;
    --color-yellow-hover:                 #ffd720;
    --color-yellow-active:                #fff039;

    --color-red:                          #fc442c;
    --color-red-hover:                    #fc5f4a;
    --color-red-active:                   #fd715e;

    --color-grey:                         #333333;
    --color-grey-hover:                   #4d4d4d;
    --color-grey-active:                  #666666;
    
    /*
    #message-box
    */
    --message-box-soft-color:             #222222;
    --message-box-soft-color-hover:       #75757e;
    --message-box-soft-color-active:      #f7f7f8;
    --message-box-soft-background:        #f7f7f8;
    --message-box-soft-border:            #e5e5ea;
    
    --message-box-info-color:             #2e7893;
    --message-box-info-color-hover:       #85cfec;
    --message-box-info-color-active:      #dff2fa;
    --message-box-info-background:        #dff2fa;
    --message-box-info-border:            #d3edf8;
    
    --message-box-note-color:             #8f5c0b;
    --message-box-note-color-hover:       #edca42;
    --message-box-note-color-active:      #f8f2cb;
    --message-box-note-background:        #f8f2cb;
    --message-box-note-border:            #f3ebab;
    
    --message-box-confirm-color:          #4a630e;
    --message-box-confirm-color-hover:    #aacf49;
    --message-box-confirm-color-active:   #e5f2c0;
    --message-box-confirm-background:     #e5f2c0;
    --message-box-confirm-border:         #dceda7;
    
    --message-box-error-color:            #cd0a0a;
    --message-box-error-color-hover:      #d97676;
    --message-box-error-color-active:     #ffd4d4;
    --message-box-error-background:       #ffd4d4;
    --message-box-error-border:           #ffc6c6;
    
    /*
    #mask
    */
    --mask-lightgallery-background:       rgba(11, 12, 13, 0.75);
    --mask-modal-background:              rgba(11, 12, 13, 0.75);
    --mask-modal-inner-background:        rgba(11, 12, 13, 0.3);
    --mask-background:                    rgba(11, 12, 13, 0.3);
    --mask-image-background:              rgba(11, 12, 13, 0.15);
    --mask-button-background:             rgba(11, 12, 13, 0.75);
    --mask-linear-gradient-background:    linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(255,255,255,0) 50%);     /* #property-fav-area */
}