:root{
    /* Typography */
    --bs-font-sans-serif:                       "Epilogue", sans-serif;
    --bs-body-font-size:                        1rem;
    --bs-body-font-weight:                      400;
    --bs-body-line-height:                      1.5;

    --font-size-xxs:                            0.625rem;
    --font-size-xs:                             0.75rem;
    --font-size-sm:                             0.875rem;
    --font-size-md:                             1rem;
    --font-size-lg:                             1.25rem;
    --font-size-xl:                             1.5rem;
    --control-font-size:                        var(--font-size-sm);

    --h1:                                       3.25rem;
    --h2:                                       2.625rem;
    --h3:                                       1.75rem;
    --h4:                                       1.375rem;
    --h5:                                       1rem;
    --h6:                                       0.875rem;

    --btn-font-size:                            var(--font-size-md);

    /*Colors*/
    --bs-body-color:                            #2E3644;
    --bs-body-color-rgb:                        85, 85, 85;
    --bs-body-bg:                               #F5F5F5;
    --bs-body-bg-rgb:                           245, 245, 245;
    --bs-dark:                                  #000;
    --bs-dark-rgb:                              46, 54, 68;
    --bs-black:                                 #000;
    --bs-black-rgb:                             0, 0, 0;
    --bs-border-color:                          #E4E4E4;
    --bs-border-dark-color:                     #B7B7B7;
    --header-bg:                                #F5F5F5;
    --header-color:                             var(--bs-body-color);
    --footer-bg:                                rgba(243, 237, 245, 0.72);
    --footer-color:                             #2E3644;
    --dark-bg:                                  #000;
    --light-bg:                                 #fff;
    --bs-label-color:                           #333;
    --bs-form-bg:                               #ECECEC;

    --primary-color:                            #92278F;
    --bs-primary:                               var(--primary-color);
    --secondary-color:                          var(--bs-secondary);
    --bs-primary-rgb:                           146, 39, 144;
    --bs-primary-dark:                          #9C6D9A;
    --primary-bg:                               #92278F;
    --primary-bg-rgb:                           114,143,99;
    --bs-secondary:                             #E9A5E7;
    --bs-secondary-rgb:                         246, 231, 245;
    --bs-secondary-dark:                        #2C3441;
    --bs-secondary-dark-rgb:                     244, 206, 20;
    --gray-bg:                                  #666666;
    --light-gray:                               var(--light-bg);

    --bs-success:                               #90B35D;
    --bs-danger:                                #FF0004;
    --bs-danger-rgb:                            246, 94, 89;
    --notification-color:                       var(--bs-danger);
    --online-color:                             #2CC84A;
    --chat-active-color:                        #F5FFF2;
    --rating-yellow:                            #FF9D00;

    --completed-color:                          0, 133, 255;
    --ongoing-color:                            40, 199, 111;
    --pending-color:                            255, 57, 57;
    --active-color:                             106, 106, 106;

    --green-bg-shade1:                          #489A24;
    --green-bg-shade2:                          #60AF38;
    --green-bg-shade3:                          #8CC96C;

    --text-primary:                             var(--primary-color);
    --text-dark-color:                          #2E3644;
    --text-gray-color:                          #898989;

    /*Icons*/
    --default-icon-size:                        1.2rem;
    --icon-sm:                                  1rem;
    --icon-md:                                  1.3rem;

    /* Focus */
    --control-focus-shadow:                     0 0 0 .35rem rgba(var( --bs-dark-rgb),.1);

    /*radius*/
    --bs-border-radius:                         0.625rem;
    --bs-border-radius-sm:                      0.25rem;
    --bs-border-radius-lg:                      0.8rem;
    --bs-border-radius-xl:                      1.5rem;
    --bs-border-radius-xxl:                     2.5rem;
    --bs-border-radius-2xl:                     var(--bs-border-radius-xxl);
    --bs-border-radius-pill:                    50rem;

    /*sizes*/
    --container-size:                           1200px;
    --header-size:                              98px;
    --default-logo-size:                        60px;
    --default-logo-md-size:                     80px;
    --btn-xs-size:                              30px;
    --btn-sm-size:                              43px;
    --btn-size:                                 48px;
    --btn-lg-size:                              60px;
    --textarea-size:                            140px;
    --page-hero-size:                           173px;
    --img-thumb-sm:                             60px;
    --img-thumb:                                100px;
    --img-thumb-md:                             154px;
    --img-thumb-md1:                            var(--textarea-size);
    --card-img-h:                               214px;
    --card-img-sm-h:                            80px;
    --img-avatar-size:                          54px;
    --img-avatar-md-size:                        96px;
    --img-avatar-lg-size:                       120px;
    --img-avatar-xs-size:                       18px;
    --img-avatar-sm-size:                       34px;
    --notification-size:                        10px;

    --panel-xs:                                 400px;
    --panel-sm:                                 590px;
    --panel-md:                                 670px;
    --panel-lg:                                 780px;
    --panel-l-size:                             305px;
    --panel-r-size:                             calc(100% - var(--panel-l-size));
    --chat-l-size:                              298px;
    --chat-r-size:                              calc(100% - var(--chat-l-size));

    --mobile-menu-size:                         320px;
    --scrollbar-size:                           8px;

    /* Space */
    --default-space:                            20px;
    --space-x:                                  0.625rem;
    --space-y:                                  0.475rem;
    --panel-space:                              95px;
    --page-y-space:                             25px;

    /*Animation time */
    --default-animation-time:                   .15s;
    --sm-animation-time:                        .5s;

    /* media query */
    --media-xs:                                 576px;
    --media-sm:                                 768px;
    --media-md:                                 992px;
    --media-lg:                                 1200px;
    --media-xl:                                 1400px;
    --media-xxl:                                1400px;
    --media-xxl:                                1400px;
}