/* COLORS ZONE---------------------------- */

[data-theme="light"] {
    --white1: #FFF;
    --white2: #F9F9F9;
    --white3: #e1e1e1;
    --black1:#292E3D;
    --black2:#212529;
    --black3:#181616;
    /* --primary:#052825; */
    --primary:#C0589E;
    --secondary:#C5DCF9;
    --tertiary:#1A73E8;
    --quaternary:#272626;
    --quinary: none;
    --radius:35px;

}

[data-theme="dark"] {
    --white1: #000000;
    --white2: #272525;
    --white3: #3f3b3b;
    --black1:#e1e4f0;
}

/* --------------------------------------- */

* {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;

    transition: all 0.3s ease;
    scroll-behavior: smooth;
}
body{
    background: #FAFAFA;
}

h1{
    font-family: "Krona One", sans-serif;
    font-weight: 400;
    font-style: normal;
}
h2, h3, h4, h5, h6{
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.bg-primary{
    background: var(--primary) !important;
}
.bg-secondary{
    background: var(--secondary) !important;
}
.bg-white{
    background: var(--white1) !important;
}
.bg-black{
    background: var(--black1) !important;
}

.clr-white{
    color: var(--white1) !important;
}
.clr-black{
    color: var(--black1) !important;
}
.clr-primary{
    color: var(--primary) !important;
}
.clr-secondary{
    color: var(--secondary) !important;
}


/* BUTTON START*/
.btn-primary{
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}
.btn-circle{
    height: fit-content;
    width: fit-content;
    display: flex;
    padding: 25px;
    gap: 10px;
}
.btn-circle-primary{
    border-radius: var(--radius);
    border: 1px solid var(--secondary);
    background: var(--primary);
}
.btn-circle-primary:hover{
    background: var(--secondary);
}

.btn-circle-white{
    border-radius: var(--radius);
    border: 1px solid var(--secondary);
    background: white;
}

/* BUTTON END  */