#readme-button {
    display: none !important;
}

/* 1. target the watermark container */
.watermark {
    visibility: hidden; /* Hides the original Chainlit text/logo */
    position: relative; /* Sets the frame for your new logo */
    margin-top: 20px;
    margin-bottom: 60px;

    /* Optional: Disable the link to the Chainlit GitHub if you want */
    pointer-events: none; 
}

/* 2. Inject your logo using a pseudo-element */
.watermark::after {
    content: "";
    visibility: visible; /* Forces the new logo to be visible */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Centers the logo */
    
    /* Adjust these to match your logo's size */
    width: 140px;  
    height: 40px; 
    
    /* Update this filename to match your logo */
    background-image: url("/public/logo_light.png");
    
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Mobile Screens (typically 768px and below) */
@media (max-width: 768px) {
    .watermark {
        margin-bottom: 100px; /* Your mobile value */
    }
}