.border-primary {
    border-color: #1879be, #c62f89, #e44236, #f48223, #8ac53f !important;
}

.bg-color {
    background-image: linear-gradient(to right, #1879be, #c62f89, #e44236, #f48223, #8ac53f);
}

.gradient-button {
    background-image: linear-gradient(to right, #1879be, #c62f89, #e44236, #f48223, #8ac53f);
    border-color: #1879be, #c62f89, #e44236, #f48223, #8ac53f !important;
}
/* Responsive design */
@media (max-width: 768px) {
    .logo-text {
        font-size: 3rem;
    }

    .logo-section {
        width: 100%;
        padding: 2rem 0 2rem;
    }

    .devanagari {
        font-size: 2.5rem;
    }

    .color-meaning {
        grid-template-columns: 1fr;
    }

    .meaning-item {
        padding: 0.5rem 1rem;
    }
}
#showhidebtn {
    position: relative;
    border: 2px solid transparent;
    border-radius: 6px;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #1879be, #c62f89, #e44236, #f48223, #8ac53f) border-box;
    color: #1879be;
    font-weight: 500;
    transition: all 0.3s ease-in-out;
}

    #showhidebtn:hover {
        background: linear-gradient(90deg, #1879be, #c62f89, #e44236, #f48223, #8ac53f);
        color: #fff;
    }
/* Responsive adjustments for select 2 drop down*/
@media (max-width: 768px) {
    .app-brand-link  img{
        width:200px !important;
    }
    .select2-container--default .select2-selection--single {
        height: calc(2.8rem + 2px) !important; /* smaller height for mobile */
        font-size: 0.9rem;
    }

        .select2-container--default .select2-selection--single .select2-selection__rendered {
            line-height: 2rem !important;
        }
}