@import url("https://fonts.googleapis.com/css2?family=Inter:wght@500&family=Nunito:wght@600&family=Rubik:wght@400;500&display=swap");
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "Nunito", sans-serif;
    font-family: "Rubik", sans-serif;
    font-family: "Inter", sans-serif;
    background-color: #f4f5fa !important;
}

:root {
    --primary-clr: #1e0153;
    --secondery-clr: #5b5b5b;
    --rubik: "Rubik", sans-serif;
    --nunito: "Nunito", sans-serif;
    --inter: "Inter", sans-serif;
}

h1 {
    font-size: 24px;
    font-weight: 500;
    font-family: var(--rubik);
    color: var(--primary-clr);
}
.workspace {
    background-color: #f4f5fa;
}

.dashboard-wrapper .card {
    transition: all 0.4s ease-in-out;
    box-shadow: none;
    border-radius: 12px;
}

/* .dashboard-wrapper .card:hover {
    margin-top: -5px;
    transition: all 0.4s ease-in-out;
} */

.dashboard-wrapper .card p {
    text-align: left;
    margin-top: 4px;
    color: #757575;
    font-size: 16px;
}

.dashboard-wrapper .card .user-count {
    text-align: left;
    font-size: 22px;
    font-weight: 500;
    font-family: var(--rubik);
    color: #2a2a2a;
    margin-top: 14px;
}

@media (max-width: 1020px) {
    .dashboard-wrapper .card {
        margin-top: 10px;
    }
}

/* SLIDE MENU STYLE STATS */

.slide-menuSection .title {
    font-size: 14px;
    font-family: var(--nunito);
    font-weight: 600;
    color: #8a8b9f;
}

.slide-menuSection .drop {
    position: relative;
    display: inline-flex !important;
    align-items: center;
}

.slide-menuSection .drop img {
    position: absolute;
    right: -25px;
    width: 20px;
}

.logo {
    width: 25px;
    height: 25px;
}

.slide-menuSection .menu-items {
    box-shadow: none;
    background-color: #ffffff;
    padding-top: 20px;
}

.slide-menuSection .menu-items .link {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    transition: all 0.5s ease-in-out;
}

/* .slide-menuSection .menu-items .link.active {
    background: #f4f5fa;
    border-radius: 10px;
    margin: 0 20px;
    transition: all 0.5s ease-in-out;
} */

.slide-menuSection .menu-items .link:hover {
    background: #f4f5fa;
    border-radius: 10px;
    margin: 0 20px;
    transition: all 0.5s ease-in-out;
}

.slide-menuSection .menu-items .link:hover .title {
    color: var(--primary-clr);
}

/* .menu-detail.collapse.open {
    border-radius: 10px;
    margin: 0 20px;
    max-width: 254px;
    width: 100%;
} */
.menu-detail.collapse.open a {
    font-family: var(--nunito);
    font-weight: 600;
    font-size: 14px;
    color: #011553;
}
/* .menu-detail.collapse.open:hover {
    background-color: #f4f5fa;
    transition: all 0.5s ease-in-out;
} */

/* SLIDE MENU STYLE ENDS */

/* LOGIN PAGE STYLE STARTS */

.login-wrapper .card {
    box-shadow: none;
}

.login-wrapper .btn_primary {
    border-radius: 8px;
    background-color: #011553;
    padding: 8px 30px;
}

.login-wrapper .btn_primary span {
    font-weight: 400;
    font-size: 16px;
    font-family: var(--rubik);
    color: #ffffff;
}

.login-wrapper .login-image {
    width: 53%;
}

.login-wrapper label {
    font-weight: 400;
    font-size: 14px;
    font-family: var(--rubik);
    color: #3c3c43;
}

.login-wrapper input {
    font-weight: 400;
    font-family: var(--rubik);
    font-size: 14px;
    color: #aeb6cf;
}

.login-wrapper .fgt-pass a {
    font-weight: 400;
    font-size: 14px;
    color: #aeb6cf;
    font-family: var(--rubik);
}
/* LOGIN PAGE STYLE STARTS */

/* USER PAGE PAGE STYLE STARTS */
.card {
    box-shadow: none;
}
.card .table tr th {
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    letter-spacing: 0.016em;
    color: #1e0153;
    font-family: var(--rubik);
    text-transform: capitalize;
}
.card .table thead {
    background-color: #f7f8fa;
    border-radius: 8px;
    height: 54px;
}

.card .table tbody tr {
    border: none;
}

.card .table tbody td {
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #5b5b5b;
    font-family: var(--rubik);
}

.card .table tbody td .avtive-btn {
    background: rgba(36, 193, 143, 0.2);
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #00ab75;
    text-transform: capitalize;
    font-family: var(--inter);
    padding: 4px 14px;
}

.card .table tbody td .draft-btn {
    background: #d9dff2;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #011553;
    text-transform: capitalize;
    font-family: var(--inter);
    padding: 4px 14px;
}

.card .table tbody td .btn-icon {
    background-color: transparent;
}

/* .card .table tbody td .btn-icon:hover{
    background-color: #011553;
} */

.user-form .form-control-addon-within {
    background: #ffffff;
    border-radius: 8px;
    border: none;
    position: relative;
}

.opend {
    background: #eaeaea;
}

.num {
    font-family: var(--rubik) !important;
    font-size: 14px !important;
    color: #1e0153 !important;
    font-weight: 500 !important;
}

.user-form .form-control-addon-within .form-control {
    padding-left: 2rem;
    padding-right: 4rem;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}

.user-form .form-control::placeholder {
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #aeb6cf;
}

.user-form .form-control-addon-within button::before {
    position: absolute;
    left: 8px;
    transform: rotate(269deg);
    color: #aeb6cf;
}

.user-form .add-btn {
    background-color: var(--primary-clr);
    border-radius: 7.63879px;
    width: 40px;
    height: 40px;
    justify-content: center;
    align-items: center;
}

.user-form .add-btn img {
    max-width: 13px;
    height: 13px;
}
/* USER PAGE STYLE STARTS ENDS */

/* PAGINATION SECTION STYLE STARS */
.pagination {
    margin-top: 30px;
    padding: 0 30px;
}
.pagination .pagi-items {
    gap: 3px;
}

.pagination .pagi-items span {
    width: 34px;
    height: 34px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: #ffffff;
    border: 1px solid #eff0f4;
    border-radius: 3px;
    transition: 0.5s ease-in;
}
.pagination .pagi-items span button {
    border: none;
}

.pagination .pagi-items span .select-none {
    background-color: var(--primary-clr);
    transition: 0.5s ease-in;
}
/* PAGINATION SECTION STYLE ENDS */

/* USER PAGE DETAIL SECTION STYLE STARTS */

.close-btn {
    color: #011553 !important;
}
.user-detail h3 {
    font-weight: 500;
    font-size: 20px;
    line-height: 150%;
    color: #011553;
    font-family: var(--rubik);
    margin-top: 15px;
    border-bottom: 1px solid #eff0f4;
    padding-bottom: 10px;
}
.user-detail label {
    color: #3c3c43;
    font-family: var(--rubik);
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
}

.user-detail input {
    background: #ffffff;
    border-radius: 8px;
}

.user-detail input::placeholder {
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #aeb6cf;
    font-family: var(--rubik);
}

.user-detail .save-btn {
    background: #011553;
    border-radius: 8px;
    width: 120px;
    height: 46px;
    display: flex;
    justify-content: center;
}

.user-detail .save-btn span {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    letter-spacing: -0.02em;
    color: #ffffff;
    font-family: var(--rubik);
}

.user-detail .input-group .input-addon {
    background-color: #ffffff;
}

.user-detail .image-upload-select .file-name {
    height: 100px;
    border: 1px solid #d3d5de;
    border-radius: 8px;
}

.user-detail .image-upload-select .input-group {
    position: relative;
}

.user-detail .image-upload-select img {
    position: absolute;
    left: 50%;
    top: 16px;
    position: absolute;
    transform: translate(-50%);
}

.login-wrapper input {color: #000000;}

/* USER PAEG DETAIL SECTION STYLE ENDS */

/* FOOTER STYLE STRATS */
.footer {
    border: none;
}

/* FOOTER STYLE ENDS */