:root {
    --mediar-green: #87B332;
    --mediar-green-dark: #5C7A25;
    --mediar-gray: #6F6F6F;
    --mediar-light: #F4F6F2;
    --mediar-white: #FFFFFF;
}

body {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(135,179,50,.25), transparent 35%),
        linear-gradient(135deg, #f7f9f4 0%, #e8eee1 100%);
    font-family: Arial, Helvetica, sans-serif;
}

.login-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 15px;
}

.login-card {
    width: 100%;
    max-width: 430px;
    background: var(--mediar-white);
    border-radius: 22px;
    padding: 35px;
    box-shadow: 0 18px 45px rgba(0,0,0,.12);
    border-top: 6px solid var(--mediar-green);
}

.login-logo {
    display: block;
    max-width: 260px;
    margin: 0 auto 25px auto;
}

.login-title {
    color: var(--mediar-green-dark);
    font-weight: bold;
    text-align: center;
    margin-bottom: 5px;
}

.login-subtitle {
    color: var(--mediar-gray);
    text-align: center;
    margin-bottom: 30px;
}
.login-logo {
    display: block;
    max-width: 280px;
    width: 100%;
    margin: 0 auto 20px auto;
}
.form-label {
    color: var(--mediar-gray);
    font-weight: bold;
}

.form-control {
    border-radius: 12px;
    padding: 12px 14px;
    border: 1px solid #d7ddcf;
}

.form-control:focus {
    border-color: var(--mediar-green);
    box-shadow: 0 0 0 .2rem rgba(135,179,50,.18);
}

.btn-mediar {
    background: var(--mediar-green);
    border: none;
    color: #fff;
    border-radius: 12px;
    padding: 12px;
    font-weight: bold;
}

.btn-mediar:hover {
    background: var(--mediar-green-dark);
    color: #fff;
}

.alert-danger {
    border-radius: 12px;
}