/* Reset body and html margins and paddings */
body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    scroll-behavior: smooth;
    font-family: 'Readex Pro', Arial, sans-serif;
    background-color: #f5f5f5;
}

/* Apply bold to Bangla text */
*:lang(bn) {
    font-weight: bold;
}

/* Red text for required field indicator */
.red--text {
    color: red;
}

/* Small left margin */
.ml-1 {
    margin-left: 0.25rem;
}

/* Gradient Box Header */
.gradient-box {
    background: linear-gradient(to top, #3b8c5a, #6dbf85);
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    box-sizing: border-box;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
}

/* Logo Styling */
.logo {
    max-width: 100px;
    height: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.form-container {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    width: 100%;
    max-width: 400px;
    position: relative;
    padding-bottom: 20px;
    overflow: hidden;
    margin: 20px auto;
}

/* Form Header Section */
.form-header {
    background-color: #3b8c5a;
    color: white;
    padding: 15px;
    border-radius: 8px 8px 0 0;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
    width: 100%;
    margin: 0;
}

.form-group:first-child {
    margin-top: 15px;
}

.form-group {
    padding: 0 20px;
    margin-bottom: 15px;
}

label {
    display: block;
    margin-bottom: 5px;

    color: #333;
}

input[type="text"],
input[type="tel"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
    font-weight: bold;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.3s ease;
}

input:focus {
    border-color: #4CAF50;
}

input:invalid {
    border-color: #e3342f;
}

.error-text {
    color: #e3342f;
    font-size: 12px;
    display: none;
}

input:invalid + .error-text {
    display: block;
}

.phone-input {
    display: flex;
    align-items: center;
}

.country-code {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px 0 0 4px;
    background-color: #f0f0f0;
    color: #333;
    font-size: 16px;
    text-align: center;
    margin-right: 5px;
}

input[type="tel"] {
    border-radius: 0 4px 4px 0;
    width: calc(100% - 75px);
}
/* Styled Button Shared Styles */
.styled-button,
.submit-btn {
    width: 100%;
    height: 50px;
    margin: 15px 0;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: transparent;
    background-image: linear-gradient(90deg, rgb(251, 193, 3) 0%, rgb(247, 150, 4) 15%, rgb(251, 193, 3) 30%, rgb(251, 221, 14) 55%, rgb(251, 193, 3));
    background-origin: padding-box;
    background-position-x: -50%;
    background-position-y: 0px;
    background-repeat: repeat;
    background-size: auto;
    border-radius: 3px;
    box-shadow: rgba(6, 8, 15, 0.1) 0px 6px 6px 1px, rgba(255, 221, 14, 0.1) 0px 6px 6px 1px, rgba(6, 8, 15, 0.1) 0px 6px 6px 1px inset;
    color: black;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
    transition: background-position 0.3s ease-in, box-shadow 0.5s ease-out, text-shadow 0.3s ease-in;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border: none;
}

.styled-button:hover,
.submit-btn:hover {
    background-image: linear-gradient(90deg, rgb(251, 193, 3) 0px, rgb(247, 150, 4) 15%, rgb(247, 150, 4) 65%, rgb(251, 193, 3));
    box-shadow: rgba(6, 8, 15, 0.1) 0px 2px 2px 1px, rgba(6, 8, 15, 0.1) 0px 4px 4px 1px, rgba(6, 8, 15, 0.1) 0px 16px 16px 1px, rgba(6, 8, 15, 0.1) 0px 32px 32px 1px, rgba(255, 221, 143, 0.1) 0px 0px 3px 0px inset;
    text-shadow: rgb(150, 115, 2) 0px 1px 3px;
    transition-delay: 0.3s;
    transition-duration: 0.6s;
}

.styled-button.clicked {
    text-shadow: none;
}

/* Chat Bubble Button */
.chat-bubble-btn {
    background-color: #3b8c5a;
    color: white;
    border: none;
    border-radius: 8px;
    padding: 15px;
    font-size: 16px;
    text-align: center;
    margin: 20px auto 0 auto;
    display: block;
    cursor: pointer;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    width: calc(100% - 40px);
}

.chat-bubble-btn:hover {
    background-color: #2e6b48;
}


/* Footer Start Here */

.footer{
    margin-top: 50px;
    padding: 25px;
    background: #d5d5d5;
}
.footer_first_div{
    display: flex;
    justify-content: space-between;
}
.footer_first_div_inner{
    width: 40%;
    display: flex;
    justify-content: space-between;
}
.footer_first_div_inner div div h4{
    font-size: 12px;
    color: #1c1c1c;
}
.footer_first_div_inner div div img{
    width: 32px;
    height: 32px;
}
.safeimg{
    margin-left: 15px;
}
.imgdiv3{
    display: flex;
}
.imgdiv3 img{
    margin-right: 15px;
}
.imgdiv3 .img1{
    width: 99px;
    height: 32px;
}
.imgdiv3 .img2{
    width: 77px;
    height: 32px;
}
.imgdiv3 .img3{
    width: 32px;
    height: 32px;
    margin-right: 0;
}
.social_media ul{
    list-style: none;
    display: flex;
    padding: 0%;
}
.social_media ul li{
    margin-right: 10px;
    font-size: 35px;
    cursor: pointer;
    color: #777777;
}
.social_media ul li:last-child{
    margin-right: 0px;
}
.hr-footer{
    margin: 10px 0px;
    width: 100%;
    height: 1px;
    border: 0 none;
    background: #bbbbbb;
}
.footer_last_div{
    display: flex;
}
.footer_last_div_inner1{
    width: 50%;
}
.footer_last_div_inner1 img{
    width: 195px;
    height: auto;
}
.footer_last_div_inner2{
    align-content: end;
}
.footer_last_div_inner2 ul{
    display: flex;
    list-style: none;
    align-content: flex-end;
}
.footer_last_div_inner2 ul li{
    font-size: 12px;
    font-weight: 700;
    margin-right: 15px;
    color: #378F6A;
    text-decoration: underline #378F6A solid 1.3px;
}
.footer_last_div_inner2 ul li:last-child{
    margin-right: 0%;
}
.footer_last_div_inner2 ul{
    align-content: flex-start;
}
.footer_p{
    color: #777777;
    font-size: 12px;
    text-align: end;
}





/* Mobile Styles */
@media (max-width: 900px) {
    .footer_first_div{
        flex-direction: column;
    }
    .footer_first_div_inner{
        width: 100%;
    }
    .margin_top{
        margin-top: 15px;
    }
    .footer_last_div_inner2 ul li{
        margin-right: 25px;
    }
    .footer_last_div_inner2 ul li:last-child{
        margin-right: 0%;
    }
    .imgdiv3 img{
        margin-right: 25px;
    }
    .imgdiv3 .img3{
        margin-right: 0;
    }
}


@media (max-width: 768px) {
    .footer_last_div_inner1 img{
        width: 130px;
        height: auto;
    } 
    .footer_last_div{
        flex-direction: column;
    }

    .footer_last_div_inner1{
        width: 100%;
    }
    .footer_last_div_inner2 ul{
        padding: 0%;
    }
    .footer_p{
        margin-top: 5px;
        text-align: start;
    }
}