/* === THEME 1 === */
.theme-1 {
    --primary: #FCB5AD;
    --secondary: #9E579D;
    --accent: #564B8F;
    --background: #F5F5F5;
    --text: #303A53;
}

    .theme-1 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-1 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-1 .text-primary {
        color: var(--primary) !important;
    }

    .theme-1 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-1 .navbar, .theme-1 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 2 === */
.theme-2 {
    --primary: #A7FF84;
    --secondary: #16B978;
    --accent: #086972;
    --background: #F0FFF5;
    --text: #071A52;
}

    .theme-2 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #071A52 !important;
    }

        .theme-2 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
            color: #fff !important;
        }

    .theme-2 .text-primary {
        color: var(--primary) !important;
    }

    .theme-2 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-2 .navbar, .theme-2 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 3 === */
.theme-3 {
    --primary: #F4F99B;
    --secondary: #F469AA;
    --accent: #BA54DE;
    --background: #FFFDF5;
    --text: #89BDF6;
}

    .theme-3 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #333 !important;
    }

        .theme-3 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
            color: #fff !important;
        }

    .theme-3 .text-primary {
        color: var(--primary) !important;
    }

    .theme-3 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-3 .navbar, .theme-3 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 4 === */
.theme-4 {
    --primary: #FC5185;
    --secondary: #36506B;
    --accent: #43DDE5;
    --background: #F5F5F5;
    --text: #1F2933;
}

    .theme-4 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-4 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-4 .text-primary {
        color: var(--primary) !important;
    }

    .theme-4 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-4 .navbar, .theme-4 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 5 === */
.theme-5 {
    --primary: #22D1EE;
    --secondary: #3D5BF1;
    --accent: #E1F3F5;
    --background: #FDFEFE;
    --text: #0D153A;
}

    .theme-5 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-5 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-5 .text-primary {
        color: var(--primary) !important;
    }

    .theme-5 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-5 .navbar, .theme-5 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 6 === */
.theme-6 {
    --primary: #571B97;
    --secondary: #9C1DEB;
    --accent: #F1568F;
    --background: #FAEE1C;
    --text: #571B97;
}

    .theme-6 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-6 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-6 .text-primary {
        color: var(--primary) !important;
    }

    .theme-6 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-6 .navbar, .theme-6 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 7 === */
.theme-7 {
    --primary: #FC5C9C;
    --secondary: #C4E3F7;
    --accent: #FCCCC2;
    --background: #FDFEFE;
    --text: #303A53;
}

    .theme-7 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-7 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
            color: #303A53 !important;
        }

    .theme-7 .text-primary {
        color: var(--primary) !important;
    }

    .theme-7 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-7 .navbar, .theme-7 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 8 === */
.theme-8 {
    --primary: #472FF7;
    --secondary: #2D6CDE;
    --accent: #46C2DA;
    --background: #F3F16A;
    --text: #0D153A;
}

    .theme-8 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-8 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-8 .text-primary {
        color: var(--primary) !important;
    }

    .theme-8 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-8 .navbar, .theme-8 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 9 === */
.theme-9 {
    --primary: #F3CF79;
    --secondary: #BE6A14;
    --accent: #AC3F22;
    --background: #FFF3E3;
    --text: #6D3B3A;
}

    .theme-9 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #6D3B3A !important;
    }

        .theme-9 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
            color: #fff !important;
        }

    .theme-9 .text-primary {
        color: var(--primary) !important;
    }

    .theme-9 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-9 .navbar, .theme-9 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 10 === */
.theme-10 {
    --primary: #CBBBE8;
    --secondary: #FECFF3;
    --accent: #A1EAFB;
    --background: #FDFDFD;
    --text: #303A53;
}

    .theme-10 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-10 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-10 .text-primary {
        color: var(--primary) !important;
    }

    .theme-10 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-10 .navbar, .theme-10 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 11 === */
.theme-11 {
    --primary: #5D5E59;
    --secondary: #FFA45D;
    --accent: #FFCDA6;
    --background: #FFF3E3;
    --text: #5D5E59;
}

    .theme-11 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-11 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-11 .text-primary {
        color: var(--primary) !important;
    }

    .theme-11 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-11 .navbar, .theme-11 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 12 === */
.theme-12 {
    --primary: #FEFF88;
    --secondary: #FE9F67;
    --accent: #FB6A59;
    --background: #FFF7E5;
    --text: #7B2039;
}

    .theme-12 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #7B2039 !important;
    }

        .theme-12 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
            color: #fff !important;
        }

    .theme-12 .text-primary {
        color: var(--primary) !important;
    }

    .theme-12 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-12 .navbar, .theme-12 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 13 === */
.theme-13 {
    --primary: #FFB173;
    --secondary: #EE5A5A;
    --accent: #B31E6F;
    --background: #FFF5EB;
    --text: #22EAAB;
}

    .theme-13 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-13 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-13 .text-primary {
        color: var(--primary) !important;
    }

    .theme-13 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-13 .navbar, .theme-13 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 14 === */
.theme-14 {
    --primary: #41514E;
    --secondary: #2F88FC;
    --accent: #31E3CB;
    --background: #F5F5F5;
    --text: #41514E;
}

    .theme-14 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-14 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-14 .text-primary {
        color: var(--primary) !important;
    }

    .theme-14 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-14 .navbar, .theme-14 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 15 === */
.theme-15 {
    --primary: #49253F;
    --secondary: #BF3545;
    --accent: #F26D5C;
    --background: #F5F5F5;
    --text: #7E7A8C;
}

    .theme-15 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-15 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
        }

    .theme-15 .text-primary {
        color: var(--primary) !important;
    }

    .theme-15 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-15 .navbar, .theme-15 .card {
        background-color: var(--background);
        color: var(--text);
    }

/* === THEME 16 === */
.theme-16 {
    --primary: #1E2978;
    --secondary: #F9FF21;
    --accent: #FED615;
    --background: #F5F5F5;
    --text: #FF1F5B;
}

    .theme-16 .btn-primary {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: #fff !important;
    }

        .theme-16 .btn-primary:hover {
            background-color: var(--secondary) !important;
            border-color: var(--secondary) !important;
            color: #1E2978 !important;
        }

    .theme-16 .text-primary {
        color: var(--primary) !important;
    }

    .theme-16 .bg-primary {
        background-color: var(--primary) !important;
    }

    .theme-16 .navbar, .theme-16 .card {
        background-color: var(--background);
        color: var(--text);
    }