:root{
    --primary-color:#1c96c2;
    
}
.color-primary{
    color: var(--primary-color);
}
.background-primary{
    background-color: var(--primary-color) !important;
}
.bg-light{
    background-color: #e2e3e8 !important;
}
.text-justify{text-align: justify;}
.logo{width: 130px;}
.profile-img{
    width: 50%;
    padding: 10px;
}
.aws-badge{
    position: absolute;
    width: 20%;
    bottom: -8%;
    right: 5%;
}
.header{
    position: relative;
}
.header::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: url(../img/bg-texture.png),linear-gradient(to left bottom,rgb(5, 55, 95),rgb(8, 3, 45),rgb(8, 3, 45));
    z-index: -1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    clip-path: polygon(0 0, 100% 0, 100% 56%, 0% 100%);
}
.border-left{
    border: 10px solid;
    border-color: transparent transparent transparent var(--primary-color);
}

.bg-profile-link{
    background-image: url(../img/bg-texture.png),linear-gradient(to left bottom,rgb(5, 55, 95),rgb(8, 3, 45));
}
.btn.social-link{
    white-space: nowrap;
    display: inline-block;
}
.img-light{
    display: none;
}
.img-dark{
    display: inline-block;
}
.img-badge{
    width: 170px;
}
body:not(.dark-mode) .btn-custom {
    color:#212529 !important;
    border-color: #212529!important;
}
.tagline{
    font-family: 'Oxygen', sans-serif;
}


/* ========= Dark Mode ========= */
.dark-mode .img-dark{
    display: none;
}
.dark-mode .img-light{
    display: inline-block;
}
body.dark-mode{
    background-color: #19181e;
    color: #eee;
}
.dark-mode .bg-light{
    background-color: #2a292e !important;
}
.dark-mode .bg-white{
    background-color: #19181e !important;
}

/* ========= Media Query ========= */
@media (max-width: 575.98px) {
    .header::before{
        clip-path: polygon(0 0, 100% 0, 100% 70%, 0% 100%);
    }
}