.home-banner {
    width: 500px;
    height: 500px
}
.Dashboard_main {
    display: flex;
    flex-direction: column;
    padding: 63px 73px 0px 78px;
    background: #000000;

}

.password-field {
    position: relative;
    display: flex;
    align-items: center;
}

.custom-bg {
    padding: 0px 78px !important;
}

.custom-input {
    width: 100%;
    padding-right: 40px;
    /* Space for the toggle button */
    border: 1px solid #9D9D9D;
    background-color: #000000;
    color: #FFFFFF;
    border-radius: 4px;
    /* Optional for rounded corners */
}

/* Placeholder color */
.custom-input::placeholder {
    color: #FFFFFF;
}

/* Button styling */
.password-toggle {
    position: absolute;
    right: 10px;
    background: none;
    border: none;
    cursor: pointer;
    color: #FFFFFF;
}

/* Icon styling */
.password-toggle i {
    font-size: 1.2rem;
}


.Dashboard_top {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 25px;
}

.Dashboard_top1 {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.Dashboard_top1_text1 {
    font-family: 'robotoregular';
    font-size: 28px;
    font-weight: 400;
    line-height: 28px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #ffffff;
    margin: 0px 0px 11px 0px !important;
}

.Dashboard_top1_text2 {
    font-family: 'robotoregular';
    font-size: 50px;
    /*font-weight: 400;*/
    line-height: 98px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #ffffff;
    margin: 0px !important;
    /*max-width: 603px;*/
}

.Dashboard_top1_button {
    width: 194px;
    height: 60px;
    border: none;
    border-radius: 14px;
    background: #D80E44;
    font-family: 'robotoregular';
    font-size: 16px !important;
    font-weight: 400;
    line-height: 31px !important;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #ffffff;
    margin: 15px 0px 0px 0px !important;
    padding: 16px;
    text-decoration: none;
}

.Dashboard_top_2 {
    display: flex;
    flex-direction: column;
    margin-top: 80px !important;
}

.Dashboard_top_2_text1 {
    font-family: 'robotoregular';
    font-size: 43.29px;
    font-weight: 400;
    line-height: 67.17px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #D80E44;
    margin: 0px !important;
}

.Dashboard_top_2_text2 {
    font-family: 'robotoregular';
    font-size: 29.85px;
    font-weight: 400;
    line-height: 44.78px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #ffffff;
    margin: 0px !important;
}

.Dashboard_top_3 {
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #000000 0%, #D80E44 148.72%);

    padding-bottom: 40px !important;
}

.Dashboard_top_3_1 {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    width: 100%;
    gap: 11.94px;
    margin-top: 20px !important;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.Dashboard_top_3_1::-webkit-scrollbar {
    display: none;
}

.imgstyle__middle {
    width: 188.07px;
    height: 105.98px;
    border-radius: 14.93px;

}

.Dashboard_top_3_2 {
    display: flex;
    flex-direction: column;
    margin-top: 63px !important;
    gap: 28px;
    padding: 0px 83px 0px 86px;
}

.Dashboard_top_3_2_text {
    font-family: 'dm_serif_displayregular';
    font-size: 28.36px;
    font-weight: 400;
    line-height: 34.71px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #FFFFFF;
    margin: 0px !important;

}

.Dashboard_top_3_2_1 {
    display: flex;
    gap: 10.73px;
    align-items: center;
}

.Dashboard_top_3_2_1______d1 {
    display: flex;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.6) 38.42%, rgba(0, 0, 0, 0) 63.42%);
    border-top-left-radius: 14.13px;
    border-top-right-radius: 14.13px;
    gap: 110px;
}

.inner {
    display: flex;
    align-items: center;
    padding-left: 21px;
    width: 100%;
}

.Dashboard_top_3_2_1______d1_text1 {
    font-family: robotoregular;
    font-size: 20px;
    font-weight: 400;
    line-height: 23.44px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #ffffff;
    margin: 0px !important;
    text-align: center;
}

.Dashboard_top_3_2_1______d2 {
    display: flex;
    flex-direction: row;
    padding: 14px 26px 14px 19px;
    gap: 14px;
    justify-content: space-between;
    width: 100%;
    border-bottom-left-radius: 14.13px;
    border-bottom-right-radius: 14.13px;
    background: #D80E44;
    border: 1.41px solid #D80E44;
}

.Dashboard_top_3_2_1______d2_text {
    font-family: robotoregular;
    font-size: 22.6px;
    font-weight: 400;
    line-height: 26.48px;
    text-align: left;
    max-width: 612px;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #ffffff;
    margin: 0px !important;
}

.Dashboard_top_3_2_1______d2_inner {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
}

.Dashboard_top_3_2_1______d2_inner_btn {
    width: 146.89px;
    height: 49.44px;
    border-radius: 70.62px;
    background-color: #ffffff;
    font-family: robotoregular;
    font-size: 19.77px;
    font-weight: 400;
    line-height: 29.66px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #D80E44;
    border: none !important;
    white-space: nowrap;
    padding: 10px;
}

.Dashboard_top_4 {
    display: flex;
    flex-direction: column;
    gap: 29.18px;
    padding: 64px 83px 0px 83px;

}

.Dashboard_top_4_text1 {
    font-family: 'robotoregular';
    font-size: 28.36px;
    font-weight: 400;
    line-height: 34.71px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #FFFFFF;
    margin: 0px !important;
}

.Dashboard_top_4_1 {
    display: flex;
    flex-direction: row;
    gap: 25px;
    flex-wrap: wrap;
}

.Dashboard_top_4_1_inner {
    display: flex;
    flex-direction: row;
    gap: 14.93px;
}

.Dashboard_top_4_1_innertext {
    font-family: 'robotoregular';
    font-size: 15px;
    font-weight: 400;
    line-height: 31.35px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #FFFFFF;
    margin: 0px !important;
}

.btmimage_style {
    width: 188.07px;
    height: 179.12px;
    border-radius: 14.93px;


}

.Dashboard_top_5 {
    display: flex;
    flex-direction: column;
    padding: 64.54px 0px 100px 0px;
    background: linear-gradient(180deg, #000000 0%, #D80E44 148.72%);

}

.Dashboard_top_5_text {
    font-family: 'robotoregular';
    font-size: 26.87px;
    font-weight: 400;
    line-height: 43.38px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #FFFFFF;
    margin: 0px 0px 15px 79px !important;
}

.Dashboard_top_5_1 {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    width: 100%;
    gap: 15.94px;

    -ms-overflow-style: none;
    scrollbar-width: none;
}

.Dashboard_top_5_1::-webkit-scrollbar {
    display: none;
}

.botttomimagestyle {
    width: 198.52px;
    height: 114.93px;
    border-radius: 14.93px;
}

.Dashboard_top_5_btn {
    width: 470.19px;
    height: 56.72px;
    border-radius: 74.63px;
    background: #FFFFFF;
    font-family: 'robotoregular';
    font-size: 24.88px;
    font-weight: 400;
    line-height: 35.82px;
    text-align: center;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    border: none !important;
    color: #D80E44;
    margin: 25.36px 0px 0px 0px !important;
    align-self: center;
    padding: 10px;
}

.topimagestyle {
    height: 550px;
    /* width: 550px; */
}

@media (max-width:1315px) {
    .Dashboard_top_3_2_1 {
        flex-direction: column;
        align-items: flex-start;
    }

    .home-banner {
        width: 500px;
        height: 500px
    }
}

@media (max-width:1190px) {
    .topimagestyle {
        height: 450px;
        /* width: 450px; */
    }

    .Dashboard_top1_text2 {
        font-size: 46px;
        line-height: 86px !important;
    }
    .home-banner {
        width: 450px;
        height: 450px
    }
}

@media (max-width:1030px) {
    .topimagestyle {
        height: 375px;
        /* width: 375px; */
    }

    .Dashboard_top1_text2 {
        font-size: 32px;
        line-height: 60px !important;
    }

    .Dashboard_top1_text1 {
        font-size: 24px;
        line-height: 24px !important;
    }

    .Dashboard_main {
        /*padding: 63px 50px 0px 50px;*/
        padding: 63px 30px 0px 0px;
    }

    .home-banner {
        width: 300px;
        height: 300px
    }
}

@media (max-width:900px) {
    .Dashboard_top_4_1_innertext,  .Dashboard_top_3_2_1______d2_text {
        font-size: 14px;
        line-height: 22px;
    }
    .Dashboard_top_3_2_1______d1 {
        display: flex;
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.6) 38.42%, rgba(0, 0, 0, 0) 63.42%);
        border-top-left-radius: 14.13px;
        border-top-right-radius: 14.13px;
        gap: 3px;
    }

    .home-banner {
        width: 400px;
        height: 400px
    }
}

@media (max-width:765px) {
    .Dashboard_top_4_1_innertext,
    .Dashboard_top_3_2_1______d2_text {
        font-size: 14px;
        line-height: 22px;
    }
    .Dashboard_top_3_2_1______d1 {
        display: flex;
        background: linear-gradient(90deg, rgba(0, 0, 0, 0.6) 38.42%, rgba(0, 0, 0, 0) 63.42%);
        border-top-left-radius: 14.13px;
        border-top-right-radius: 14.13px;
        gap: 3px;
    }
    .customstylebtn {
        width: 90% !important;
    }

    .topimagestyle {
        /* width: 100%; */
        height: 320px;
    }

    .home-banner {
        width: 300px;
        height: 300px
    }

    .Dashboard_top_3_2_1______d2 {
        flex-direction: column;
        align-items: flex-end;
        width: unset;
    }

    .Dashboard_top_3_2_1______d1 {
        width: 100%;
        justify-content: space-between;
    }

    .Dashboard_top_3_2 {
        padding: 0px 45px 0px 45px;
    }

    .Dashboard_main {
        padding: 40px 35px 0px 35px !important;
    }

    .logostyles {
        width: 130px;
        height: 60px;
    }

    .profile-section {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start !important;
    }
    .Dashboard_top {
        flex-direction: column;
    }
}

@media (max-width:570px) {


    .customstylebtn {
        width: 90% !important;
    }

    .Dashboard_top_4 {
        padding: 64px 35px 0px 35px;
    }

    .Dashboard_top_5_btn {
        width: 100%;
    }

    .Dashboard_top_3_2 {
        padding: 0px 30px 0px 30px;
    }

    .Dashboard_top_3_2_1______d1 {
        gap: 10px;
    }

    .Dashboard_top1_text2 {
        font-size: 30px;
        line-height: 56px !important;
    }

    .imgstyle__middle {
        width: 140.07px;
        height: 89.98px;

    }

    .Dashboard_top_4_1_inner {
        flex-direction: column-reverse;
    }

    .Dashboard_main {
        padding: 40px 30px 0px 30px !important;
    }

    .logostyles {
        width: 110px;
        height: 50px;
    }

    .Dashboard_top_3_2_text,
    .Dashboard_top_2_text2 {
        font-size: 20px;
        line-height: 29px;
    }

    .Dashboard_top_2_text1 {
        font-size: 30px;
        line-height: 50px;
    }

    .Dashboard_top_4_1_innertext,
    .Dashboard_top_3_2_1______d2_text {
        font-size: 14px;
        line-height: 22px;
    }

    .Dashboard_top_5_text {

        margin: 0px 0px 15px 35px !important;
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    .Dashboard_top_3_2_1 {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 14px !important;
    }

    .Dashboard_top_3_2_1______d1 {
        flex: 1 1 50%;
        max-width: 97%;
    }

    .Dashboard_top_3_2_1______d2 {
        flex: 1 1 50%;
        max-width: 97%;
    }
}
@media (min-width: 1024px) and (max-width: 1199px) {
    .Dashboard_top_3_2_1 {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 16px !important;
    }

    .Dashboard_top_3_2_1______d1,
    .Dashboard_top_3_2_1______d2 {
        flex: 1 1 50%;
        max-width: 99%;
    }
}
@media (max-width: 1199px) {
    .Dashboard_top_3_2_1______d1 img {
        max-height: 220px;
    }
}

/* Scoped layout fix for Keep Practicing section only */
.keep-practicing .keep-practicing-flex {
    /*display: flex;*/
    /*flex-direction: column;*/
    /*gap: 16px;*/
}

/* Responsive Image Wrapper */
.keep-practicing .keep-practicing-image-wrapper {
    padding: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.keep-practicing .keep-practicing-img {
    max-width: 100%;
    height: auto;
    max-height: 240px;
    object-fit: contain;
    border-radius: 12px;
}

/* iPad Landscape Only */
@media (min-width: 1024px) and (max-width: 1199px) {
    .keep-practicing .keep-practicing-flex {
        /*flex-direction: row;*/
        /*align-itemstems: stretch;*/
    }

    .keep-practicing .keep-practicing-left,
    .keep-practicing .keep-practicing-right {
        /*flex: 1 1 50%;*/
        max-width: 100%;
    }

    .keep-practicing .keep-practicing-img {
        max-height: 200px;
    }
}
/* Large screen fix */
@media (min-width: 1200px) {
    .keep-practicing .keep-practicing-flex {
        /*flex-direction: row;*/
        /*align-items: stretch;*/
        /*gap: 20px;*/
    }

    .keep-practicing .keep-practicing-left,
    .keep-practicing .keep-practicing-right {
        flex: 1 1 50%;
        max-width: 50%;
    }

    .keep-practicing .keep-practicing-image-wrapper {
        padding: 0 15px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .keep-practicing .keep-practicing-img {
        max-width: 100%;
        height: auto;
        max-height: 250px;
        object-fit: contain;
        border-radius: 12px;
    }
}
/* Reduce horizontal gap between left and right columns */
.keep-practicing .keep-practicing-flex {
    /*gap: 0 !important;*/
}

/* Remove padding inside image container */
.keep-practicing .keep-practicing-image-wrapper {
    padding: 0 !important;
}

/* Remove margin on the text block if any */
.keep-practicing .Dashboard_top_3_2_1______d2 {
    margin: 0 !important;
}
.keep-practicing .Dashboard_top_3_2_1______d2 {
    padding-left: 20px;
}

@media (min-width: 1200px) {
    .keep-practicing .keep-practicing-flex {
        /*gap: 0 !important;*/
    }

    .keep-practicing .keep-practicing-image-wrapper {
        padding: 0 !important;
    }

    .keep-practicing .Dashboard_top_3_2_1______d2 {
        margin: 0 !important;
        padding-left: 20px; /* Optional: for a little breathing room */
    }
}
.Dashboard_top_3_2_1 {
    gap: 28px;
}
/* Default: stacked layout for mobile/tablet */
.keep-practicing .keep-practicing-flex {
    /*display: flex;*/
    /*flex-direction: column;*/
    /*gap: 0 !important;*/
}

/* Make sure both sides have zero padding/margin */
.keep-practicing .keep-practicing-left,
.keep-practicing .keep-practicing-right {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100%;
    width: 100%;
}

/* Prevent image wrapper from adding space */
.keep-practicing .keep-practicing-image-wrapper {
    margin: 0 !important;
    padding: 0 !important;
}

/* Image responsive */
.keep-practicing .keep-practicing-img {
    max-width: 100%;
    height: auto;
    max-height: 250px;
    object-fit: contain;
    border-radius: 12px;
}

/* Desktop (≥1200px) — force side-by-side and remove space */
@media (min-width: 1200px) {
    .keep-practicing .keep-practicing-flex {
        /*flex-direction: row !important;*/
        /*align-items: stretch;*/
    }

    .keep-practicing .keep-practicing-left,
    .keep-practicing .keep-practicing-right {
        flex: 1 1 50% !important;
        max-width: 50% !important;
    }

    .keep-practicing .keep-practicing-right {
        padding-left: 8px; /* OPTIONAL: reduce or remove if still too wide */
    }

    .keep-practicing .Dashboard_top_3_2_1______d2_text {
        margin: 0 !important;
    }
}
