:root {
    --wa-teal: #008069;
    --wa-dark: #128C7E;
    --wa-teal-light: #8dc7bc;
}
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    min-height: 100vh;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--wa-dark) 60%, white) 0%,
        color-mix(in srgb, var(--wa-dark) 20%, white) 45%,
        #ffffff 100%
    );
}
.content{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    width: 100%;
    padding: 16px;
}
.app-logo {
    width: 6.25rem;
    height: 6.25rem;
    object-fit: contain;
    border-radius: 0.5rem;
    box-shadow: 0 20px 35px rgba(0,0,0,0.3);
}


.footer{
    position: fixed;
    bottom: 30px;
    left: 0;
    width: 100%;
    height: 50px;
    
    display: flex;
    align-items: center;
    justify-content: center;

    color: #ffffff;
    font-size: 1rem;
    z-index: 1020;

}
.footer span {
    padding: 6px 16px;
    border-radius: 20px;
    background: var(--wa-teal);
    box-shadow:
        0 4px 10px rgba(0, 0, 0, 0.25),
        0 1px 3px rgba(255, 255, 255, 0.15) inset;

    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.25),
        0 2px 6px rgba(0, 0, 0, 0.15);
}