/*----------------*/
/*-----fonts------*/
/*----------------*/

@font-face {
    font-family: 'yekan-reg';
    src: url("../fonts/yekan.woff2");
}


/*----------------*/
/*------core------*/
/*----------------*/

@media (prefers-color-scheme: light) {
    :root {
        /* Update CSS variables */
        --text-color: black;
    }
}

[data-theme=light],
.theme-light {
    --text-color: black;
    /* Update CSS variables */
}

:root {
    --background-color: white;
    --text-color: black;
}

body {
    font-family: yekan-reg;
    background-color: #FFFFff;

}

p {
    color: black
}


.maincontainer {
    min-height: 100dvh;
    width: 100dvw;


}

.button {
    outline: none;
}

.h100 {
    height: 100% !important;
}

.w100 {
    width: 100%;
}

.columns {
    margin: 0;
}

.dvh {
    min-height: 100dvh;
}

/*----------------*/
/*----colors------*/
/*----------------*/

.clrone {
    background-color: #4FE8E3 !important;
}

.clrtwo {
    background-color: #1B95A2 !important;
}

.clrtwotext {
    color: #1B95A2;
}

.clrthree {
    background-color: #737375;
}

.clrfour {
    background-color: #E1C886;
}

.clrfive {
    background-color: #AB9D7C;
}

.clrsix {
    background-color: #FF4941;
}

.clrsixtext {
    color: #FF4941;
}

.clrseven {
    background-color: #FFFFff;
}

.clrseventext {
    color: #FFFFff !important;
}

.clreight {
    background-color: #f2f1ec;
}

.clrnine {
    background-color: rgba(236, 236, 236, 0.4);
}

.clrten {
    background-color: rgba(236, 236, 236, 0.6);
    backdrop-filter: blur(0.6rem);
}


/*----------------*/
/*-margins paddings-*/
/*----------------*/

.paddingx {
    padding-left: 1rem;
    padding-right: 1rem;
}


/*-----------------------------*/
/*---------shadows------------*/
/*----------------------------*/


.shadowone {
    box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.4);
}


/*-----------------------------*/
/*--borders and border rads----*/
/*----------------------------*/
.borderrad1 {
    border-radius: 0.6rem;
}


.bordercircle {
    border-radius: 50%;
}

/*-----------------------------*/
/*--spinner----*/
/*----------------------------*/


.loader {
    width: 48px;
    height: 48px;
    display: inline-block;
    position: relative;
}

.loader::after,
.loader::before {
    content: '';
    width: 48px;
    height: 48px;
    border: 3px solid #1B95A2;
    position: absolute;
    left: 0;
    top: 0;
    box-sizing: border-box;
    animation: rotation1 2s ease-in-out infinite;
}

.loader::after {
    border-color: #FF4941;
    animation-delay: 1s;
}


@keyframes rotation1 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}