body { background-color: #333131; font-family: Arial, sans-serif; margin: 20px; color: #7e6fe2; }
        .gastos-container { max-width: 600px; margin: auto; }
        input, button { width: 100%; margin: 5px 0; padding: 10px; font-size: 1rem; border-radius: 8px; border: none; box-sizing: border-box; }
        button { background-color: #7FFFD4; color: black; font-weight: bold; cursor: pointer; transition: 0.3s; }
        button:hover { background-color: #66ccaa; }
        ul { list-style-type: none; padding: 0; }
        li { display: flex; align-items: center; justify-content: space-between; font-weight: bold; margin: 8px 0; padding: 12px; background: #444; border-radius: 8px; }
        .pago { text-decoration: line-through; color: #888; opacity: 0.6; }
        #inputValor, #inputData, #inputDescricao { background-color: #7FFFD4; color: black; font-weight: bold; }
        .info-valores { margin-top: 20px; border-top: 2px solid #7e6fe2; padding-top: 10px; }
        .status-btn { font-size: 1.5rem; cursor: pointer; margin-right: 10px; }
        .delete-btn { font-size: 1.3rem; cursor: pointer; margin-left: 10px; filter: grayscale(1); }
        .delete-btn:hover { filter: grayscale(0); }

        select {
            background-color: transparent;
            border: none;
            color: #7e6fe2;
            font-size: inherit;
            font-weight: bold;
            cursor: pointer;
            padding: 0 5px;
            margin: 0 3px;
        }
        select:focus {
            outline: none;
            text-decoration: underline;
        }