/* 
text editor - https: //yabwe.github.io/medium-editor/
cool animations - https: //codepen.io/
icons - https: //fontawesome.com/
*/

body{
    font-family: "Zain", sans-serif;
    color: var(--secondary-color);
    min-height: 100vh !important;
}
.pattern-bg {
    background-image: url("../images/logos/logo_bg.svg");
    /* replace with your file name */
    background-repeat: repeat;
    /* repeats in both directions */
    background-size: 400px 385px;
    /* controls tile size */
    background-color: #ffffff;
    /* fallback color */
}
.pattern-bg-alt {
    background-image: url("../images/logos/Pattern.png");
    /* replace with your file name */
    background-repeat: no-repeat;
    /* repeats in both directions */
    background-size: cover;
    /* controls tile size */
    background-color: #ffffff;
    /* fallback color */
}
main{
    margin-top: 80px !important;
}
#internal-body{
    min-height: 100vh;
}

.iku-btn-round {
    border-radius: 30px;
}

.iku-container-round {
    border-radius: 60px;
}
.lh-25 {
    line-height: 25px;
}

.lh-50 {
    line-height: 50px;
}

form{
    p{
        label, input{
            display: block;
        }
        input{
            border-radius: 5px;
        }
    }
}
h1{
    color: var(--secondary-color);
}

/* NAVIGATION STYLES */
#main-nav {
    background-color: white !important;

    img {
        width: 200px;
    }

    .nav-item {
        .nav-link {
            padding: 2.5px 35px;
            color: var(--secondary-color)
        }

        .nav-active {
            background-color: var(--primary-color);
            border-radius: 30px;
            border-style: solid;
            border-color: var(--primary-color);
            color: white !important;
        }
    }
}
.dropdown-menu{
    .dropdown-item:active,:hover{
        background-color: var(--primary-color);
        color: #ffffff;
    }
    .dropdown-item:focus-visible{
        border-color: var(--secondary-color);
    }
}

@media (max-width: 991px) {
    #portal-sidebar-container {
        min-height: fit-content !important;
    }
}
/**intenal view **/
.iku-sidebar-item:hover {
    background-color: var(--primary-color);
    color: white;
}
.iku-sidebar-item.sidebar-active {
    background-color: var(--primary-color);
    color: white;
}
.sidebar-list-header:hover{
    color: var(--third-color);
}
#internal-body{
    border-top: var(--fourth-color);
    border-top-style: solid;
    border-top-width: 5px;
}
.internal-navbar-button:hover{
    background-color: var(--third-color) !important;
    color: white;
}
.internal-tab-active{
    background-color: var(--third-color) !important;
    color: white;
}
.client-detail-sect{
    translate: 0 -150px;
}
#header-bg{
    height: 200px;
}
.border-top-gold{
    border-top: 5px solid var(--fourth-color);
}
/* dashboard css */

#portal-sidebar-container{
    min-height: 100vh;
}

 .project-card {
    background-color: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    padding: 1.5rem;
    transition: transform 0.2s ease, box-shadow 0.3s ease;
    cursor: pointer;
    border-top: 5px solid var(--fourth-color);
    line-height: 15px !important;

    h3 {
        margin: 0 0 0.5rem;
        font-size: 1.1rem;
        color: var(--secondary-color);
    }
    p {
        font-size: 0.9rem;
        color: var(--secondary-color);
    }
 }
#client-info-sect{
    border-radius: 30px;
    border-style: solid;
}
 .project-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
 }
.project-card-alt{
    aspect-ratio: 2 / 1;
    overflow-wrap: break-word;
    background: linear-gradient(135deg, white, var(--primary-color) 100%);
    
}
 .iku-hover:hover{
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
 }
 .iku-shadow{
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
 }
.project-progress-container{
    width: 100%;
    /* Full width */
    background-color: gray
    /* Grey background */
}

.project-progress{
    text-align: right;
    /* Right-align text */
    padding-top: 10px;
    /* Add top padding */
    padding-bottom: 10px;
    /* Add bottom padding */
    color: white;
    /* White text color */
}

.embeded-doc{
    height: 700px;
}
.del-document-name{
    overflow-wrap: anywhere;
}
/* Green */
/* Mobile responsiveness */
@media (max-width: 576px) {
    #login-container,
    .container,
    .w-75 {
        width: 100% !important;
        padding: 1rem !important;
    }
    #launch-banner p {
        font-size: 2rem !important;
    }
    main {
        padding: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    #ikuo-studio-text1 img{
        width: -webkit-fill-available;
    }
    footer{
        margin: 0 !important;
    }
}
@media (max-width: 1210px) {
    #main-nav {

        .nav-item {
            .nav-link {
                padding: 2.5px 15px;
            }
        }
    }
}

.min-vh-50{
    min-height: 50vh !important;
}

.min-vh-75 {
    min-height: 75vh !important;
}

.max-vh-50 {
    max-height: 50vh !important;
}

.max-vh-75 {
    max-height: 75vh !important;
}
.vh-50 {
    height: 50vh !important;
}

.vh-75 {
    height: 75vh !important;
}