$blue: #3c63e2 !default;
$indigo: #6610f2 !default;
$purple: #6f42c1 !default;
$pink: #d63384 !default;
$red: #f73563 !default;
$orange: #fd7e14 !default;
$yellow: #ffbd17 !default;
$green: #3ac79b !default;
$teal: #0ab2be !default;
$cyan: #0dcaf0 !default;

:root {
    --fimobile-green: $green;
    --fimobile-red: $red;
    --fimobile-yellow: $yellow;
    --fimobile-blue: $blue;
    --fimobile-rounded: 15px;
    --fimobile-padding: 15px;
    --bs-gutter-x: var(--fimobile-padding); //bootstrap column padding
    --fimobile-input-rounded: 10px;

    .row > *,
    .container,
    .container-fluid,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        padding-left: var(--fimobile-padding);
        padding-right: var(--fimobile-padding);
    }
    .row {
        margin-right: calc(var(--fimobile-padding) * -1);
        margin-left: calc(var(--fimobile-padding) * -1);
    }

    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #57bdff;
    --fimobile-theme-color-grad-2: #4f77fb;
    --fimobile-theme-color-grad-3: #6528cf;

    /* color schemes */
    --fimobile-theme-color: #092c9f;
    --fimobile-theme-color-2: #001c77;
    --fimobile-theme-color-light: #d3ddfd;
    --fimobile-theme-bordercolor: #dadff6;
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-card-color: rgba(255, 255, 255, 0.85);
    --fimobile-card-text: #000000;

    --fimobile-page-bg-1: #f1f3f8;
    --fimobile-page-bg-2: #e5ecfe;
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}

.theme-indigo{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #0897e9;
    --fimobile-theme-color-grad-2: #5100d4;
    --fimobile-theme-color-grad-3: #270069;

    /* color schemes */
    --fimobile-theme-color: $indigo;
    --fimobile-theme-color-2: darken($indigo, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($indigo, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;


    --fimobile-page-bg-1: lighten($red, 40%);
    --fimobile-page-bg-2: lighten($indigo, 45%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);

}


.theme-purple{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #e908d8;
    --fimobile-theme-color-grad-2: #5a2ab3;
    --fimobile-theme-color-grad-3: #300284;

    /* color schemes */
    --fimobile-theme-color: $purple;
    --fimobile-theme-color-2: darken($purple, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($purple, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($cyan, 45%);
    --fimobile-page-bg-2: lighten($purple, 45%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);

}

.theme-pink{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #f38ac4;
    --fimobile-theme-color-grad-2: #d11e78;
    --fimobile-theme-color-grad-3: #300284;

    /* color schemes */
    --fimobile-theme-color: $pink;
    --fimobile-theme-color-2: darken($pink, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($pink, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($yellow, 43%);
    --fimobile-page-bg-2: lighten($pink, 45%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}

.theme-red{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #ffc107;
    --fimobile-theme-color-grad-2: #e91547;
    --fimobile-theme-color-grad-3: #77001c;

    /* color schemes */
    /* color schemes */
    --fimobile-theme-color: $red;
    --fimobile-theme-color-2: darken($red, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($red, 25%), 0.10);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($yellow, 42%);
    --fimobile-page-bg-2: lighten($red, 45%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}

.theme-orange{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #ffc107;
    --fimobile-theme-color-grad-2: #ec6c02;
    --fimobile-theme-color-grad-3: #c70042;

    /* color schemes */
    --fimobile-theme-color: $orange;
    --fimobile-theme-color-2: darken($orange, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($orange, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($yellow, 43%);
    --fimobile-page-bg-2: lighten($orange, 42%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}

.theme-yellow{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #ffdb6f;
    --fimobile-theme-color-grad-2: #f0ac00;
    --fimobile-theme-color-grad-3: #f03000;

    /* color schemes */
   --fimobile-theme-color: $yellow;
   --fimobile-theme-color-2: darken($yellow, 8%);
   --fimobile-theme-color-light: #f4fdff;
   --fimobile-theme-bordercolor: rgba(darken($yellow, 25%), 0.15);
   --fimobile-theme-text: #ffffff;

   --fimobile-header: transparent;
   --fimobile-header-active: #ffffff;
   --fimobile-header-text: #000000;

   --fimobile-footer: #ffffff;
   --fimobile-footer-text: #999999;
   --fimobile-footer-text-active: var(--fimobile-theme-color);

   --fimobile-sidebar: var(--fimobile-theme-color);
   --fimobile-sidebar-text: #ffffff;
   --fimobile-sidebar-text-active: #ffffff;

   --fimobile-page-bg-1: lighten($blue, 42%);
   --fimobile-page-bg-2: lighten($yellow, 42%);
   --fimobile-page-text: #000000;
   --fimobile-page-link: var(--fimobile-theme-color);
}


.theme-green{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #a9e682;
    --fimobile-theme-color-grad-2: #1fbb8a;
    --fimobile-theme-color-grad-3: #0072c3;

    /* color schemes */
    --fimobile-theme-color: $green;
    --fimobile-theme-color-2: darken($green, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($green, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($yellow, 45%);
    --fimobile-page-bg-2: lighten($green, 45%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}


.theme-teal{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #a2fffa;
    --fimobile-theme-color-grad-2: #00a2ad;
    --fimobile-theme-color-grad-3: #3f51b5;

    /* color schemes */
    --fimobile-theme-color: $teal;
    --fimobile-theme-color-2: darken($teal, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($teal, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($red, 39%);
    --fimobile-page-bg-2: lighten($teal, 55%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}


.theme-cyan{
    /* radial gradient colors */
    --fimobile-theme-color-grad-1: #9df5dc;
    --fimobile-theme-color-grad-2: #00b5da;
    --fimobile-theme-color-grad-3: #673ab7;

    /* color schemes */
    --fimobile-theme-color: $cyan;
    --fimobile-theme-color-2: darken($cyan, 8%);
    --fimobile-theme-color-light: #f4fdff;
    --fimobile-theme-bordercolor: rgba(darken($cyan, 25%), 0.15);
    --fimobile-theme-text: #ffffff;

    --fimobile-header: transparent;
    --fimobile-header-active: #ffffff;
    --fimobile-header-text: #000000;

    --fimobile-footer: #ffffff;
    --fimobile-footer-text: #999999;
    --fimobile-footer-text-active: var(--fimobile-theme-color);

    --fimobile-sidebar: var(--fimobile-theme-color);
    --fimobile-sidebar-text: #ffffff;
    --fimobile-sidebar-text-active: #ffffff;

    --fimobile-page-bg-1: lighten($red, 40%);
    --fimobile-page-bg-2: lighten($cyan, 45%);
    --fimobile-page-text: #000000;
    --fimobile-page-link: var(--fimobile-theme-color);
}


@media screen and (max-width: 340px) {
    :root {
        --fimobile-padding: 10px;
        --fimobile-rounded: 12px;
    }

}