body { font-family: Arial, sans-serif; margin: 0; background: #f6f9f8; }
        header {
            background: #2e8b57;
            color: #fff;
            padding: 4px 0;
            text-align: center;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1000;
        }
        main {
            margin-top: 140px;
        }
        .logo {
            width: 80px;
            height: 80px;
            background: #fff;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 10px;
        }
        .logo svg { width: 60px; height: 60px; }
        main { 
            max-width: 800px; 
            margin: 140px auto 40px auto; /* Top margin matches header height */
            background: #fff; 
            padding: 30px; 
            border-radius: 12px; 
            box-shadow: 0 2px 8px #0001; 
        }
        h1 { margin-top: 0; }
        footer { text-align: center; color: #888; padding: 20px 0; }


.error_input {
    background-color: rgb(235, 168, 25);
    border: 4px solid rgb(179, 18, 18);
}
.good_input {
     border:1px solid #075f16;
     background-color: rgb(147, 209, 150);

}
.menu-toggle {background: none;
             border: none; cursor: 
             pointer; padding: 0; 
             position: absolute; 
             left: 20px; 
             top: 20px; 
             z-index: 1100;
            }
.menu {
    display: none; 
    position: absolute; 
    top: 56px; left: 20px; 
    background: #fff; 
    color: #2e8b57; 
    list-style: none; 
    margin: 0; 
    padding: 10px 0; 
    border-radius: 8px;
     box-shadow: 0 2px 8px #0002; 
     min-width: 160px; z-index: 1200;
}
.menu li {
padding: 10px 24px; 
color: #2e8b57; 
text-decoration: none;
}
.loginform_div{
position: absolute; 
right: 30px; 
top: 20px; 
display: flex; 
flex-direction: column; 
align-items: flex-end; 
gap: 8px; 
background: #fff2; 
padding: 12px 16px; 
border-radius: 8px 
}

.login-form {
display: flex; 
flex-direction: column; 
gap: 8px; 
width: 180px;
}
login-form-input {
    padding: 8px; 
    border: 2px solid #ccc; 
    border-radius: 4px; 
    font-size: 14px; 
    width: 90%;
}
.login-form button {
    padding: 8px; 
    background: #2e8b57; 
    color: #fff; 
    border: none; 
    border-radius: 4px; 
    cursor: pointer; 
    font-size: 12px;
}

/* Add your CSS styles here */

.signup-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    justify-content: center;
    align-items: center;
}


     #signup-form input[type="text"],
        #signup-form input[type="email"],
        #signup-form input[type="tel"],
        #signup-form input[type="password"] {
            width: 80%;
            box-sizing: border-box;
        }
.signup-form-input {
        padding:8px; 
        border-radius:4px; 
       
    }
    .signup-btn {
        background:#2e8b57; 
        color:#fff;
         border:none; 
         border-radius:4px; 
         padding:10px; 
         font-size:16px; 
         cursor:pointer;
    }
    /*style="width: 90%;"*/